﻿@charset "utf-8";

/*COMMON */
.layout{position:relative;margin:0 auto;max-width:1020px;width:100%;}
.layout:after{content:"";display:block;clear:both}

.ir{overflow:hidden}
.ir:before{content:"";display:inline-block;vertical-align:top;width:100%;height:100%}

.motion {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.delay1{
    -webkit-transition-delay:0.1s;
    -moz-transition-delay:0.1s;
    -o-transition-delay:0.1s;
    transition-delay:0.1s;
}
.delay2{
    -webkit-transition-delay:0.2s;
    -moz-transition-delay:0.2s;
    -o-transition-delay:0.2s;
    transition-delay:0.2s;
}
.delay3{
    -webkit-transition-delay:0.3s;
    -moz-transition-delay:0.3s;
    -o-transition-delay:0.3s;
    transition-delay:0.3s;
}



.ir-tmpl{background:url(../../images/common/ir-tmpl.png) no-repeat}
.ir-common{background:url(../../images/common/ir-common.png) no-repeat}
.bg_gray{background-color:#f3f4f7}


#wrapper{position:relative;width:100%;}
#mpopup{display:none;height:0;}

/*header*/
#header{position:relative;width:100%;height:135px;background-color:#fff;z-index:100;}
#animate{
    position:relative;height:135px;background:url(../../images/common/bg_gnb.png) repeat-x;overflow:hidden;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

#animate .style{
    height:135px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}


#animate.action{border-bottom:2px solid #ec008c;}


#header #brandlogo,
#header #sitelink{position:relative;z-index:1;}
#header #brandlogo{display:block;float:left;padding-top:5px;width:81px;height:47px;font-size:0;background-position:-128px 0;}
#header #sitelink{float:right;padding-top:20px;height:47px}
#sitelink a{display:inline-block;margin-left:8px;padding-left:14px;line-height:1.4;vertical-align:middle;color:#6f6f6f;font-size:13px;transition:color 0.1s ease;background:url(../../images/common/bul_line.png) no-repeat left 50%}
#sitelink a:first-child{padding-left:0;background:none;}
#sitelink a:hover,
#sitelink a:active,
#sitelink a:focus{color:#4264ad;}


#logo{display:block;position:absolute;left:20%;top:30px;margin-left:-60px;width:120px;height:74px;z-index:99}
#logo a{display:block;width:100%;height:100%;font-size:0;}


#gnb{position:absolute;top:66px;left:0;width:100%;}
#gnb .layout{padding:0 50px;}
#tm{ padding-left: 30%; }
#tm:atter{display:block;content:"";clear:both;visibility:hidden;}
#tm .th1{float:left;width:25%}
#tm .th1 .th1_lnk{display:block;position:relative;padding:22px 0;color:#fff;font-size:18px;line-height:1.6;text-align:center;height:71px;}
#tm .th1 .th1_lnk.current,
#tm .th1 .th1_lnk:hover,#tm .th1 .th1_lnk:focus{text-decoration:underline;}
#tm .summary{position:absolute;top:80px;}
#tm .th2{display:block;position:relative;width:100%;text-align:left;}
#tm .th2 li {float:left;width:auto;}
#tm .th2 a{display:block;padding:5px 15px;color:#1c449c;font-size:14px;font-weight:bold;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;  transition: all 0.3s ease-out;}
#tm .th2 a:hover,
#tm .th2 a:active,
#tm .th2 a:focus{color:#ec008c;font-weight:bold;}
#tm .quick_link{display:block;width:100%;text-align:left;}
#tm .quick_link:after{display:block; clear:both; content:""; visibility:hidden; height:0;}
#tm .quick_link li {float:left;width:33.33%;}
#tm .quick_link li a{display:block;position:relative;padding:30px 30px 20px 22px;color:#4264ad;font-size:16px;line-height:1.4;font-weight:bold;background:url(../../images/common/bul1.png) no-repeat 90% 53%;}
#tm .quick_link li a *{vertical-align:middle;}
#tm .quick_link li a:after{display:block;content:"";position:absolute;top:20px;right:0;width:1px;height:56px;background-color:#d2daeb}
#tm .quick_link li.last a{color:#ed008c;background:url(../../images/common/bul2.png) no-repeat 90% 53%;}
#tm .quick_link li.last a:after{display:none;}
#tm .quick_link li a .ir{display:inline-block;width:52px;height:43px;background:url(../../images/common/ir-lk.png) no-repeat;margin-right:10px;}
#tm .quick_link li a .ir-lk01{background-position:0 0}
#tm .quick_link li a .ir-lk02{background-position:-75px 0}
#tm .quick_link li a .ir-lk03{background-position:-143px 0}

/*
#tm .quick_link{display:block;position:relative;width:100%;text-align:left;}
#tm .quick_link:after{display:block; clear:both; content:""; visibility:hidden; height:0;}
#tm .quick_link li {float:left;width:33.33%;}
#tm .quick_link li a{display:block;position:relative;padding:30px 30px 20px 22px;color:#4264ad;font-size:16px;line-height:1.4;font-weight:bold;background:url(../../images/common/bul1.png) no-repeat 90% 53%;}
#tm .quick_link li a *{vertical-align:middle;}
#tm .quick_link li a:after{display:block;content:"";position:absolute;top:20px;right:0;width:1px;height:56px;background-color:#d2daeb}
#tm .quick_link li.last a{color:#ed008c;background:url(../../images/common/bul2.png) no-repeat 90% 53%;}
#tm .quick_link li.last a:after{display:none;}
#tm .quick_link li a .ir{display:inline-block;width:52px;height:43px;background:url(../../images/common/ir-lk.png) no-repeat;margin-right:10px;}
#tm .quick_link li a .ir-lk01{background-position:0 0}
#tm .quick_link li a .ir-lk02{background-position:-75px 0}
#tm .quick_link li a .ir-lk03{background-position:-143px 0}
*/
#tm #summary1{left:105px;}
#tm #summary2{left:0;}
#tm #summary2 .th2{}
#tm #summary2 .th2 li{width:200px;border-right:1px solid #d2daeb;text-align:center}
#tm #summary2 .th2 li.last{border-right:none;}
#tm #summary2 .th3{display:block;position:relative;padding:15px 0;width:100%;height:253px;text-align:center;}
#tm #summary2 .th3.th3_1{background:url(../../images/common/th3_1.png) no-repeat 50% bottom;}
#tm #summary2 .th3.th3_2{background:url(../../images/common/th3_2.png) no-repeat 50% bottom;}
#tm #summary2 .th3.th3_3{background:url(../../images/common/th3_3.png) no-repeat 50% bottom;}
#tm #summary2 .th3.th3_4{background:url(../../images/common/th3_4.png) no-repeat 50% bottom;}
#tm #summary2 .th3.th3_5{background:url(../../images/common/th3_5.png) no-repeat 50% bottom;}
#tm #summary2 .th3 li {border:none;}
#tm #summary2 .th3 li a{display:block;padding:3px 0;color:#666;font-size:13px;line-height:1.3;font-weight:normal;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;  transition: all 0.3s ease-out;}
#tm #summary2 .th3 li a:hover,
#tm #summary2 .th3 li a:active,
#tm #summary2 .th3 li a:focus{color:#1c449c;text-decoration:underline;}

#tm #summary3{right:258px;}
#tm #summary4{right:128px;}
/*
#tm .th1 .th1_lnk{display:block;position:relative;padding:17px 30px;background-color:#fff;color:#3b3b3b;font-size:18px;line-height:1.2;text-align:center;}
#tm .th1 .th1_lnk .line{position:absolute; display:block; bottom:-3px; z-index:10; height:3px; width:0%; background-color:#3073d5; left:0;}
#tm .th1 .th1_lnk.current,
#tm .th1 .th1_lnk:hover,#tm .th1 .th1_lnk:focus{color:#0d3983}
#tm .th1 .current .line{width:100%;}

#tm .th2{display:block;position:relative;padding:15px 0;width:100%;text-align:left;opacity:0;}
#tm .th2:before{display:block;content:"";position:absolute;left:-1px;top:0;width:1px;height:1000%;background-color:#ddd;}
#tm .th2:after{display:block;content:"";position:absolute;right:0;top:0;width:1px;height:1000%;background-color:#ddd;}
#tm .th2.current{opacity:1;}
#tm .th2 li {float:none;width:auto;}
#tm .th2 a{display:block;padding:5px 15px;color:#666;font-size:14px;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;  transition: all 0.3s ease-out;}


#tm .th2 a:hover,
#tm .th2 a:active,
#tm .th2 a:focus{background-color:#3e61b2;color:#fff;}

*/


#snb #leftmenu{position:relative}
#snb #leftmenu .th2{float:left;border-right:1px solid #efefef;}
#snb #leftmenu .th2:first-child{border-left:1px solid #efefef;}
#snb #leftmenu .th2 a{z-index:10;position:relative;display:block;padding:16px 0;text-align:center;font-size:16px;line-height:1;transition:border-color 0.1s,color 0.3s;-webkit-transition:border-color 0.1s,color 0.3s;}
#snb #leftmenu .th2 a:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#snb #leftmenu .th2 .link_2th{color:#666;}

#snb #leftmenu .th2 .link_2th_ov,
#snb #leftmenu .th2 .link_2th:hover,
#snb #leftmenu .th2 .link_2th:focus{color:#ec008c;font-weight:bold;}

#th_3{z-index:11;}
.menu_3th{width:100%;}
.menu_3th li{display:inline-block;float:left;}
.menu_3th.col3 li{width:33.33%}
.menu_3th.col2 li{width:50%}
.menu_3th.col4 li{width:25%}

.menu_3th li a{display:block;border-left:1px solid #fff;padding:10px 15px;font-size:13px;color:#fff;text-align:center}
.menu_3th li .link_3th{background-color:#909cb5;}
.menu_3th li:first-child .link_3th{border-left:none;}
.menu_3th li .link_3th_ov,
.menu_3th li .link_3th:hover,
.menu_3th li .link_3th:focus{background-color:#4264ad}


/*
#remote #lnb .th3{display:none;position:absolute;top:57px;left:0;width:100%;border:solid #ddd;border-width:0 1px 1px;background:#fff}
#remote #lnb .th3 li{display:inline-block}
#remote #lnb .th3 li .link_3th{display:block;padding:20px 15px;font-size:15px;color:#565656}
#remote #lnb .th3 li .link_3th_ov,#remote #lnb .th3 li .link_3th:hover,#remote #lnb .th3 li .link_3th:focus{display:block;font-size:15px;color:#e83052}

#remote.animate{transition:padding 0.3s;-webkit-transition:padding 0.3s}
#remote.action{padding-bottom:57px}
*/



#svisual{position:relative;background:#9493d8 url(../../images/common/bg_svisual.png) repeat-x 50% 50%}
#svisual.customer{background:#5ab5da url(../../images/common/bg_svisual_customer.png) repeat-x 50% 50%}
#svisual.event{background:#50c2c7 url(../../images/common/bg_svisual_event.png) repeat-x 50% 50%}

#svisual .layout{padding:30px 0;height:100px;text-align:center}
#svisual .layout h1{color:#fff;font-size:32px;line-height:1.3;}


#sv_event{position:relative;height:348px;background:url(../../images/event/bg_event.png) repeat-x 50% 50%}
#sv_event .it_event{position:relative;margin:0 auto;padding:36px 0;max-width:1600px;height:100%;background:url(../../images/event/it_event.png) no-repeat 100% 50%}
#sv_event h1{color:#fff;font-size:32px;line-height:1.3;}
#sv_event p{margin:10px 0 15px 0;color:#fff;font-size:16px;line-height:1.3;}
#sv_event .lst_event{position:relative;padding:18px 15px;padding-right:230px;border:1px solid #fff;width:587px;height:155px;/*background:url(../../images/event/event_good.png) no-repeat 100% top*/}
#sv_event .lst_event:after{display:block;content:"";position:absolute;top:0;right:-1px;width:227px;height:100%;background:url(../../images/event/event_good.png) no-repeat 100% top}
#sv_event .lst_event ul{}
#sv_event .lst_event ul li{color:#fff;line-height:1.4;margin-bottom:10px;}
#sv_event .lst_event ul li em{padding-left:92px;font-size:13px;}
#sv_event .lst_event ul li em:first-child{padding-left:0;}
#sv_event .lst_event ul li em i{font-style:normal;color:#00fffc;}
#container{position:relative;width:100%;padding:40px 0 100px 0;}
#container.bg_customer{background:url(../../images/common/bg_customer.png) no-repeat 50% 0;/*background-size:cover;*/}
#container.bg_customer .layout{padding:0 53px;}

#container.bg_brand{background:#fff;/*background-size:cover;*/}
#container.bg_office{background:url(../../images/brand/bg_office.png) no-repeat 50% 0;/*background-size:cover;*/}


#container.product_item{position:relative;padding:0;margin-top:-40px;z-index:10}

/*footer*/
#footer{position:relative;background-color:#43454c;z-index:10;}
#footer .layout{position:relative;padding:21px 0;padding-left:162px;}
#footer .footer_logo{position:absolute;top:21px;left:0;width:93px;height:52px;font-size:0;background-position:-161px -143px;}
#footer .footer_menu{margin-bottom:5px;}
#footer .footer_menu li{display:inline-block;margin-left:14px;line-height:1}
#footer .footer_menu li a{display:block;padding-left:14px;font-size:13px;line-height:1.3;color:#b1b4bd;background:url(../../images/common/bul_line.png) no-repeat left 50%}
#footer .footer_menu li.privacy a{color:#fff;}
#footer .footer_menu li:first-child{margin-left:0}
#footer .footer_menu li:first-child a{padding-left:0;background:none;}

#footer .finfo{position:relative;padding-right:185px;}
#footer address,
#footer .copy{color:#8c8e95;line-height: 1.6;}
#footer address div{display:inline-block;letter-spacing:-1px;font-size:13px;}
#footer .number{}
#footer .copy{font-size:12px;}
#footer .combo-box1 { position:absolute;top:0;right:0; z-index:1002;width:160px;border:1px solid #a5a8b5;}
/*#footer .combo-box1:after { position:absolute; top:0; left:0; width:3px; height:100%;  }*/
#footer .combo-box1__btn { display:block; height:100%; margin:0; padding:5px 12px; border:none; background-color:transparent; color:#a5a8b5;font-size:12px;line-height:1.4; text-decoration:none; text-align:left; text-transform:uppercase; cursor:pointer;background:url(../../images/common/combo-box_bul.png) no-repeat 95% 50%;}
#footer .combo-box1__btn.ov{background:url(../../images/common/combo-box_ov.png) no-repeat 95% 50%;}
#footer .combo-box1__list { display:none; position:absolute; z-index:9999; bottom:27px; left:-1px; width:160px; margin:0; padding:0; background-color:#a5a8b5; list-style:none;}
#footer .combo-box1__item { min-height:30px; border-width:1px 1px 0; border-style:solid; border-color:#fff; }
/*#footer .combo-box1__item:first-child { border-top-width:1px; }*/
#footer .combo-box1__link { display:block; padding:7px; color:#fff; text-decoration:none; line-height:1.33333333;font-size:12px; }
#footer .combo-box1__link:hover {text-decoration:underline;}

#offlinewrap{position:relative;background-color:#34353a;}
#offlinewrap ul li {display:inline-block;float:left;overflow:hidden;width:calc(25% - 15px);padding:10px 20px 8px 13px;line-height:0;border-left:1px solid #484a4f;box-sizing:border-box;}
#offlinewrap ul li:first-child{border-left:none;}
#offlinewrap ul li:after{display:block; clear:both; content:"."; visibility:hidden; height:0;}
#offlinewrap ul li *{vertical-align:middle;}
#offlinewrap ul li span{display:inline-block;float:left;color:#a5a8b5;font-size:13px;line-height:31px;}
#offlinewrap ul li .lnkbox{display:inline-block;float:right;}
#offlinewrap ul li .lnkbox a{display:inline-block;margin:0 2px;}
#offlinewrap ul li:last-child {width:calc(25% + 40px);padding-right: 0;}


#bcustomer{overflow:hidden;position:relative;height:54px;background-color:#fff;border-top:1px solid #e5e5e5;}
#bcustomer *{vertical-align:middle;}
#bcustomer .box{display:inline-block;float:left;padding:15px 0;padding-right:0;width:50%;position:relative;}
#bcustomer .box:first-child{border-right:1px solid #e5e5e5;}
#bcustomer .box h2{font-size:16px;}
#bcustomer .box *{margin:0;padding:0;}


#bcustomer #bcenter{padding-left:222px;}
#bcustomer #bcenter h2{position:absolute;top:16px;left:19px;color:#ec008c;}
#bcustomer #bcenter p{color:#4264ad;font-size:14px;font-weight:bold;}

#bcustomer #bnotice{padding-left:100px;padding-right:77px;}
#bcustomer #bnotice h2{position:absolute;top:16px;left:19px;color:#000;}
#bcustomer #bnotice .control{position:absolute;top:16px;right:19px;width:48px;}
#bcustomer #bnotice .control button{display:inline-block;float:left;width:24px;height:24px;font-size:0;background:url(../../images/common/bg_control.gif) no-repeat;}
#bcustomer #bnotice .control button[data-type="prev"]{background-position:0 0}
#bcustomer #bnotice .control button[data-type="next"]{background-position:-24px 0}

#bcustomer #bnotice .grap{position:relative;width:100%;height:23px;overflow:hidden}
#bcustomer #bnotice .grap .obj{position:relative;width:100%;height:100%;}
#bcustomer #bnotice .grap .obj .item {display:block;position: relative;width: 100%;height: 100%;}


.product_item .obj{}
.product_item .obj .layout{padding:22px 0;max-width:1000px;}

