/* main common */
a.btn_more { position:relative; display:inline-block; height:30px; line-height:30px; padding:0px 7px 0px 2px; font-family:'Titillium Web'; font-size:1.063rem; font-weight:700; color:#bbbcbf; }
a.btn_more:before { position:absolute; right:-17px; top:calc(50% + 1px); margin-top:-1px; display:block; width:17px; height:2px; transition:all 0.2s; content:''; }
a.btn_more:after { position:absolute; right:-23px; top:calc(50% + 1px); margin-top:-5px; display:block; width:6px; height:10px; transition:all 0.2s; content:''; }
a.btn_more:hover:before { right:-25px; width:25px; transition:all 0.2s; }
a.btn_more:hover:after { right:-31px; transition:all 0.2s; }

/* main slider */
.visual_text { position:absolute; left:50%; top:0px; margin-left:-600px; width:1200px; height:calc(100% - 160px); }
.visual_text .inbox { position:absolute; top:50%; transform:translateY(-50%); }

.main_visual { display:none; position:relative; width:100%; -webkit-tap-highlight-color:transparent; position:relative; z-index:1; overflow:hidden; }
.main_visual [class^="item"] { width:100%; height:690px; }
.main_visual .item1 { background:url('../images/visual/visual_1.jpg') 60% top no-repeat; background-size:cover; }
.main_visual .item2 { background:url('../images/visual/visual_2.jpg') center top no-repeat; background-size:cover; }
.main_visual .item3 { background:url('../images/visual/visual_3.jpg') center top no-repeat; background-size:cover; }
.main_visual .owl-nav { display:none; }
/* .main_visual .owl-dots.disabled { display:none; } */
.main_visual .owl-dots { position:absolute; left:50%; bottom:0px; margin-left:-600px; width:1200px; line-height:0; padding-bottom:80px; margin-bottom:80px; }
.main_visual .owl-dot { cursor:pointer; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; font-size:0px; }
.main_visual button.owl-dot { display:inline-block; width:10px; height:10px; margin:0px 4px; background-color:#FFF; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; outline:0px; border:0px; vertical-align:middle; }
.main_visual button.owl-dot.active { width:14px; height:14px; border:3px solid #FFF; background:transparent; }

.visual_text p { letter-spacing:-2px; line-height:1; word-break:keep-all; padding:9px 0px; font-size:3.5rem; font-weight:100; }
.visual_text p strong { font-size:3.5rem; font-weight:700; }
.visual_text .small { padding-top:40px; font-size:1.188rem; font-weight:300; color:#666; letter-spacing:-1px; line-height:1.5; }
.visual_text .underline { position:relative; display:inline-block; z-index:0; }
.visual_text .underline:after { position:absolute; left:-13px; bottom:-12px; display:inline-block; width:100%; height:26px; padding-left:10px; padding-right:10px; background-color:#FFF; box-sizing:content-box; z-index:-1; content:''; }
.visual_text .br { display:block; }
.main_visual .item2 .visual_text p { text-align:right; color:#FFF; }
.main_visual .item2 .visual_text p.txt2 { padding:22px 0px 14px; }
.main_visual .item2 .visual_text p.txt2 span { position:relative; display:inline-block; }
.main_visual .item2 .visual_text p.txt2 span:after { position:absolute; left:50%; top:-10px; margin-left:-2px; display:block; width:5px; height:5px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; background-color:#FFF; content:''; }
.main_visual .item2 .visual_text p.txt3 strong { position:relative; display:inline-block; padding:6px 10px; z-index:1; }
.main_visual .item2 .visual_text p.txt3 strong:after { position:absolute; left:0px; top:50%; transform:translateY(-47%); width:100%; height:100%; background-color:#3e4487;  z-index:-1; content:''; }
.main_visual .item3 .visual_text p { color:#FFF; }
.main_visual .item3 .visual_text p.txt2 strong { margin-right:6px; }
.main_visual .item3 .visual_text .small { color:#91939f; }
.main_visual .item3 .visual_text .underline:after { background-color:#3e4487; }

.owl-stage { position:relative; -ms-touch-action:pan-Y; touch-action:manipulation; -moz-backface-visibility:hidden; }
.owl-stage:after { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
.owl-stage-outer { position:relative; overflow:hidden; -webkit-transform:translate3d(0px, 0px, 0px); }
.owl-wrapper,
.owl-item { -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); }
.owl-item { position:relative; min-height:1px; float:left; -webkit-backface-visibility:hidden; -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; }
.owl-item img { display: block; /* width: 100%;  */ }
.owl-loaded { display:block; }
.owl-loading { opacity:0; display:block; }
.owl-hidden { opacity:0; }
.no-js .main_visual { display:block; }

/* partner slider */
.partner_list { padding:40px 0px; font-size:0; }
.partner_list h4 { display:inline-block; width:100px; font-family:'Roboto'; font-size:1.063rem; font-weight:500; vertical-align:middle; }
.partner_slider { display:inline-block; position:relative;  width:calc(100% - 100px); padding:0px 30px; display:inline-block; -webkit-tap-highlight-color:transparent; z-index:1; vertical-align:middle; }
.partner_slider .item img { margin:0px auto; max-width:100%; }
.partner_slider .owl-dots { display:none; }
.partner_slider .owl-nav { position:absolute; left:0px; top:50%; margin-top:-12px; width:100%; }
.partner_slider .owl-nav button { display:inline-block; width:22px; height:22px; border:1px solid #d4d4d4; background-color:#FFF; outline:0px; box-sizing:content-box; transition:all 0.2s; }
.partner_slider .owl-nav button span { display:block; width:100%; height:100%; opacity:0.4; font-size:0px; transition:all 0.2s; }
.partner_slider .owl-nav button.owl-prev span { background:url('../images/main/partner_prev_on.png') 45% center no-repeat; }
.partner_slider .owl-nav button.owl-next { position:absolute; right:0px; }
.partner_slider .owl-nav button.owl-next span {background:url('../images/main/partner_next_on.png') 55% center no-repeat; }
.partner_slider .owl-nav button:hover,
.partner_slider .owl-nav button:active { border-color:#b4b4b4; transition:all 0.2s; }
.partner_slider .owl-nav button:hover span,
.partner_slider .owl-nav button:active span { opacity:1; transition:all 0.2s; }


/* main quick */
.main_quick { margin-top:-80px; }
.main_quick [class^="item"] { float:left; position:relative; width:25%; background-color:#222; overflow:hidden; z-index:10; }
.main_quick [class^="item"] a { display:block; width:100%; height:100%; }
.main_quick [class^="item"] h2 { font-size:1.5rem; font-weight:500; color:#FFF; letter-spacing:-1px;text-shadow: -1px 0 #222, 0 1px #222, 1px 0 #222, 0 -1px #222; }
.main_quick [class^="item"] p { padding-top:14px; line-height:1.3; color:#FFF; word-break:keep-all; letter-spacing:-0.6px;text-shadow: -1px 0 #222, 0 1px #222, 1px 0 #222, 0 -1px #222;  }
.main_quick [class^="item"] img { width:100%; }
.main_quick [class^="item"] .text { position:absolute; left:0px; top:0px; width:100%; height:100%; padding:50px 14px 0px 14px; text-align:center; z-index:3; }
.main_quick [class^="item"] .object_top { position:absolute; top:-20px; left:-35px; width:100%; z-index:0; }
.main_quick [class^="item"] .object_top img { width:102%; }
.main_quick [class^="item"] .object { position:absolute; right:0px; bottom:0px; width:100%; z-index:1; }
.main_quick [class^="item"] .object_bg { position:absolute; right:0px; bottom:0px; width:100%; z-index:0; }
.main_quick [class^="item"] .color_black { color:#000;text-shadow: -1px 0 #FFF, 0 1px #FFF, 1px 0 #FFF, 0 -1px #FFF;  }
.main_quick [class^="item"] .object,
.main_quick [class^="item"] .object_top,
.main_quick [class^="item"] .img,
.main_quick .item1:hover .img,
.main_quick .item2:hover .img,
.main_quick .item3:hover .img,
.main_quick .item4:hover .img,
.main_quick .item1:hover .object,
.main_quick .item1:hover .object_top { -webkit-transition:all 0.4s ease; -moz-transition:all 0.4s ease; -ms-transition:all 0.4s ease; -o-transition:all 0.4s ease; transition:all 0.4s ease; } 

.main_quick .item1:hover .img,
.main_quick .item2:hover .img,
.main_quick .item3:hover .img,
.main_quick .item4:hover .img { -webkit-transform:scale(1.05); -ms-transform:scale(1.05); -moz-transform:scale(1.05); transform:scale(1.05); }
.main_quick .item1:hover .object { -webkit-transform:translateX(14px); -ms-transform:translateX(14px); -moz-transform:translateX(14px); transform:translateX(14px); }
.main_quick .item1:hover .object_top { -webkit-transform:translate(10px, 10px); -ms-transform:translate(10px, 10px); -moz-transform:translate(10px, 10px); transform:translate(10px, 10px); }
.main_quick .item1 { border: 2px #FFF solid; }
.main_quick .item2 { border: 2px #FFF solid; }
.main_quick .item3 { border: 2px #FFF solid; }
.main_quick .item4 { border: 2px #FFF solid; }
.main_quick .item1:hover,
.main_quick .item2:hover,
.main_quick .item3:hover,
.main_quick .item4:hover { border: 2px #2f97ca solid; transition:all 0.4s; }


/* main why */
.main_why { position:relative; margin:80px 0px; }
.main_why dt { float:left; width:25%; padding:11px 0px 6px 34px; border-left:4px solid #242424; }
.main_why dt span { display:block; font-family:'Roboto'; font-size:2.625rem; font-weight:100; }
.main_why dt strong { display:block; font-size:2.313rem; font-weight:700; letter-spacing:-2px; padding-top:6px; }
.main_why dt a { margin-top:74px; }
.main_why dd { float:left; width:18.75%; padding:20px 0px; text-align:center; }
.main_why dd span { display:block; }
.main_why dd span img { height:100%; }
.main_why dd p { padding-top:50px; font-size:1.063rem; line-height:1.3; letter-spacing:-0.6px; }
.main_why dd img, .main_sns li a {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.main_why dd:hover { cursor:pointer; }
.main_why dd:hover img,
.main_why dd:focus img,
.main_why dd:active img { -webkit-transform:translateY(10px); -ms-transform:translateY(10px); -moz-transform:translateY(10px); transform:translateY(10px); }
.main_why a.btn_more { color:#bbbcbf; }
.main_why a.btn_more:before { background-color:#bbbcbf; }
.main_why a.btn_more:after { background:url('../images/main/arrow_gray.png') right center no-repeat; }

.wrapper { margin-left:-16px; }
.wrapper [class^="main_"] { float:left; padding-left:16px; }
.wrapper [class^="main_"] .inner { padding:42px 36px; }
.wrapper [class^="main_"]:after { display:block; clear:both; content:''; }

.main_banner .inner,
.main_board .inner,
.main_sns .inner { position:relative; height:300px; overflow:hidden; }
.main_banner .inner .bg,
.main_board .inner .bg { position:absolute; left:0px; top:0px; width:100%; height:100%; z-index:-2; }
.main_board,
.main_sns { width:calc( (100% - 284px - 16px) / 2); margin-top:16px; }

/* main qna */
.main_qna { width:284px; box-sizing:content-box; }
.main_qna .inner { position:relative; height:616px; background-color:#00b18c; overflow:hidden; }
.main_qna a.box { position:absolute; left:0px; top:0px; display:block; width:100%; height:100%; z-index:3; }
.main_qna p { width:100%; padding-left:3px; font-family:'Roboto'; font-size:14px; font-weight:300; color:#FFF; text-transform:uppercase; text-align:justify; overflow:hidden; letter-spacing:17px; white-space:nowrap; }
.main_qna h3 { padding-top:16px; color:#FFF; letter-spacing:-2px; line-height:1.3; }
.main_qna h3 span { display:block; font-size:2rem; font-weight:100; }
.main_qna h3 strong { display:block; font-size:1.938rem; font-weight:500; }
.main_qna a.btn_more { position:absolute; bottom:42px; color:#FFF; }
.main_qna a.btn_more:before { background-color:#fff; }
.main_qna a.btn_more:after { background:url('../images/main/arrow_white.png') right center no-repeat; }
.main_qna:hover a.btn_more:before { right:-25px; width:25px; transition:all 0.2s; }
.main_qna:hover a.btn_more:after { right:-31px; transition:all 0.2s; }

.main_qna [class^="object"] { position:absolute; bottom:0px; transition:ease-in-out 0.4s; }
.main_qna .object_q { left:-9px; bottom:180px; z-index:2; }
.main_qna .object_qBG { left:-24px; bottom:212px; z-index:1; }
.main_qna .object_a { right:-10px; bottom:66px; z-index:2; }
.main_qna .object_aBG { right:-35px; bottom:-60px; z-index:1; }

.main_qna:hover [class^="object"] { transition:ease-in-out 0.4s; }
.main_qna:hover .object_q { left:7px; bottom:166px; }
.main_qna:hover .object_qBG { left:-24px; bottom:192px; }
.main_qna:hover .object_a { right:7px; bottom:80px; }
.main_qna:hover .object_aBG { right:-35px; bottom:-40px; }

/* main banner */
.main_banner { width:calc(100% - 284px - 16px); }
.main_banner .inner { /*background:url('../images/main/pure_bg.jpg') center no-repeat;*/ }
.main_banner .inner .text { position:absolute; left:0px; top:calc(50% + 6px); transform:translateY(-50%); width:100%; padding-left:20px; padding-right:20px; text-align:center; }
.main_banner .inner .text h3 { font-size:2rem; font-weight:100; color:#FFF; letter-spacing:-2px; }
.main_banner .inner .text h3 strong { position:relative; font-weight:500; line-height:1.2; word-break:keep-all; }
.main_banner .inner .text p { padding-top:6px; font-size:1.063rem; font-weight:300; color:#FFF; line-height:1.3; letter-spacing:-0.6px; word-break:keep-all; }
.main_banner .banner1 .text h3 { display:inline-block; padding:0px 16px 3px; background-color:#395e9b; color:#FFF; }
.main_banner .banner1 .text p { color:#242424; }
.main_banner .banner2 .text h3 strong:before { position:absolute; left:44%; bottom:22px; display:block; width:43px; height:76px; background:url('../images/main/img_water.png') no-repeat; background-size:contain; opacity:0.85; z-index:-1; content:''; }

/* main board */
.main_board .inner { /*background:url('../images/main/board_bg.jpg') center no-repeat;*/ }
.main_board .board_tab { border-bottom:1px solid #999; }
.main_board .board_tab a { float:left; line-height:1; }
.main_board .board_tab a.board_more { float:right; width:30px; height:30px; padding-top:4px; font-size:0px; text-align:right; }
.main_board .board_tab [class^="board__"] { position:relative; display:block; width:calc( (100% - 30px) / 2); padding-bottom:14px; font-size:1.375rem; font-weight:300; letter-spacing:-1px; text-align:center; color:#FFF; opacity:0.7; }
.main_board .board_tab [class^="board__"]:hover { opacity:1; transition:0.2s; }
.main_board .board_tab [class^="board__"].on { font-weight:500; opacity:1; }
.main_board .board_tab [class^="board__"].on:after { position:absolute; left:0px; bottom:-1px; display:block; width:100%; height:5px; background:url('../images/main/bg_gradient.jpg') repeat-y; background-size:contain; content:''; }

.main_board .board_list li { position:relative; padding:19px 0px; border-bottom:1px solid #666; }
.main_board .board_list li a { float:right; width:calc(100% - 46px); padding-left:20px; padding-top:4px; }
.main_board .board_list li a > * { display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.main_board .board_list li a strong { font-size:1.125rem; font-weight:500; color:#FFF; }
.main_board .board_list li a span { font-size:0.938rem; font-weight:300; color:#CCC; padding-top:9px; }
.main_board .board_list li a:hover strong { text-decoration:underline; }
.main_board .board_list li p { float:left; width:46px; font-family:'Roboto'; letter-spacing:-0.6px; text-align:center; }
.main_board .board_list li p strong { display:block; font-size:2.250rem; font-weight:bold; color:#FFF; }
.main_board .board_list li p span { display:block; font-size:13px; font-weight:300; color:#f4f4f4; }
.main_board .board_list li:after { display:block; clear:both; content:''; }

.main_board .board_list2 li { position:relative; height:59px; padding:9px 0px; border-bottom:1px solid #666; font-size:0; }
.main_board .board_list2 li a { display:inline-block; width:calc(100% - 46px); padding-left:12px; vertical-align:middle; }
.main_board .board_list2 li a > * { display:block; text-overflow:ellipsis; overflow:hidden; }			
.main_board .board_list2 li a strong { display:-webkit-box; font-size:1rem; font-weight:500; line-height:1.3; color:#FFF; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.main_board .board_list2 li a span { font-size:0.938rem; font-weight:300; color:#CCC; padding-top:9px; }
.main_board .board_list2 li a:hover strong { text-decoration:underline; }
.main_board .board_list2 li p { display:inline-block; width:46px; padding-top:2px; font-family:'Roboto'; letter-spacing:-0.6px; text-align:center; vertical-align:middle; }
.main_board .board_list2 li p strong { display:block; font-size:1.25rem; font-weight:bold; color:#FFF; }
.main_board .board_list2 li p span { display:block; padding-top:2px; font-size:13px; font-weight:300; color:#f4f4f4; }
.main_board .board_list2 li:after { display:block; clear:both; content:''; }
.main_data .board_list2 li { border-color:#203e64; }

.main_banner .inner .bg,
.main_board  .inner .bg { -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }
.main_banner .inner:hover .bg,
.main_board  .inner:hover .bg {
    -webkit-transform:scale(1.05) perspective(500px) rotate(.001deg);
    -ms-transform:scale(1.05) perspective(500px) rotate(.001deg);
    -moz-transform:scale(1.05) perspective(500px) rotate(.001deg);
    transform:scale(1.05) perspective(500px) rotate(.001deg);
}
/* main sns */
.main_sns .inner { background:url('../images/main/sns_bg.jpg') right center no-repeat; background-size:cover; }
.main_sns h3 { font-size:1.625rem; font-weight:300; letter-spacing:-1px; }
.main_sns h3 strong { display:block; padding-top:7px; font-weight:700; }
.main_sns ul { padding-top:40px; font-size:0px; margin-left:-3px; margin-right:-3px; }
.main_sns li { display:inline-block; }
.main_sns li a { display:block; padding:0px 3px; }
.main_sns li a img { height:100%; }
.main_sns li a:hover { -webkit-transform:translateY(-10px); -ms-transform:translateY(-10px); -moz-transform:translateY(-10px); transform:translateY(-10px); }