@charset "utf-8";

@import url(base.css);
@import url(index.css);
@import url(sub.css);

/*--------------------------*/
/* common */
/*--------------------------*/

#cmm_warp {float:left; width:100%; min-width:1200px;}

header {position:relative; float:left; width:100%; height:90px; background:url("../img/common/headerBg.jpg") 0 0 / cover no-repeat;}
header h1 {position:absolute; left:30px; top:14px;}
header > ul {position:absolute; left:50%; top:0; width:900px; height:100%; margin-left:-400px;}
header > ul > li {position:relative; float:left; width:20%; height:100%;}
header > ul > li > a {position:relative; display:block; width:100%; height:100%; padding-top:30px; box-sizing:border-box; font-size:20px; font-family:"notoMedium"; text-align:center; color:white !important;}
header > ul > li:hover > a {color:#ff5500 !important;}
header > ul > li:last-child > a:hover span {width:100px; margin-left:-10px;}
header > ul > li > ul {position:absolute; left:0; top:80px; z-index:999; width:100%; padding:20px 0 0 50px; box-sizing:border-box;}
header > ul > li:last-child > ul {padding-left:25px;}
header > ul > li > ul li {margin-top:20px;}
header > ul > li > ul a {font-size:16px; font-family:"notoMedium"; color:#777777 !important;}
header > ul > li > ul a:hover {color:#ff5500 !important;}

header .language {position:absolute; right:20px; top:20px; }
header .language button {width:52px; height:24px; margin-top:10px; text-align:left; vertical-align:top; color:white; font-family:"notoMedium"; font-size:20px;  background:url("../img/common/arrowLanguage.png") 100% 12px no-repeat; }
header .language div {position:absolute; right:0; top:45px; border:1px solid white;}
header .language div::after {position:absolute; left:0; top:0; display:block; width:100%; height:100%; content:""; background:white; opacity:0.8;}
header .language a {position:relative; z-index:9; display:block; width:60px; padding:5px 0; font-family:"notoMedium"; font-size:16px; text-align:center;}
header .language a:last-child {border-top:1px solid white;}

header > span {position:absolute; left:0; top:90px; z-index:99; display:block; width:100%; height:260px; opacity:0.9; background:white; border-top:1px solid #ececec;}

header > a {position:absolute; right:0; top:0; width:140px; height:100%; padding:30px 0 0 50px; box-sizing:border-box; font-size:20px; font-family:"notoMedium"; color:white !important; background:url("../img/common/iconShop.png") 16px 31px no-repeat; border-bottom:5px solid #ff6619;}

#cmm_banner {float:left; width:100%; padding:22px 0 20px; text-align:center; border-top:1px solid #e6e6e6;}
#cmm_banner a {margin-left:60px;}
#cmm_banner a:first-child {margin-left:0;}

#cmm_bottom {float:left; width:100%; background:#222222;}
#cmm_bottom > div {width:1200px; margin:0 auto;}
#cmm_bottom > div > div {float:left; width:100%; padding:40px 0; color:white;}

#cmm_bottom .link {float:left; width:100%; margin-bottom:20px;}
#cmm_bottom .link a {display:block; float:left; font-size:16px; font-family:"notoMedium"; color:white;}
#cmm_bottom .link span {position:relative; top:5px; display:inline-block; float:left; width:1px; height:14px; margin:0 13px 0 17px; background:#7f7f7f;}

#cmm_bottom address {float:left; width:100%;}
#cmm_bottom address span {position:relative; top:1px; display:inline-block; width:1px; height:12px; margin:0 17px; background:#7f7f7f;}

footer {float:left; width:100%; background:#222222; border-top:1px solid #393939;}
footer > div {width:1200px; margin:0 auto;}
footer > div > div {float:left; width:100%; padding:38px 0;}

footer p {color:#777777;}

/*--------------------------*/
/* sub */
/*--------------------------*/

#cmm_subVisual {float:left; width:100%; height:200px; background:url("../img/common/subVisual.jpg") 50% 50% / cover no-repeat;}
#cmm_subVisual > div {width:1200px; height:100%; margin:0 auto;}
#cmm_subVisual > div > div {float:left; width:100%; height:100%; padding-top:60px; box-sizing:border-box;}

#cmm_subVisual h2 {margin-bottom:2px; font-size:36px; font-family:"notoBlack";}
#cmm_subVisual h2 span {position:relative; top:-5px; display:inline-block; width:1px; height:14px; margin:0 16px; background:#6a6a6a;}
#cmm_subVisual h2 em {position:relative; top:-5px; font-size:20px; font-family:"notoMedium";}
#cmm_subVisual p {font-size:16px; font-family:"notoBold"; letter-spacing:7px; color:#bbbbbb;}

#cmm_snv {float:left; width:100%; height:60px; background:#e5e5e5; border-bottom:1px solid #e7e7e7;}
#cmm_snv > div {width:1200px; height:100%; margin:0 auto;}
#cmm_snv > div > div {float:left; width:100%; height:100%;}
#cmm_snv .home {float:left; display:block; width:60px; height:100%; background:#f15101 url("../img/common/iconHome.png") 50% 50% no-repeat; border-left:1px solid #e7e7e7;}
#cmm_snv .box {position:relative; float:left; height:100%;}
#cmm_snv .box button {position:relative; float:left; min-width:300px; height:100%; padding:0 50px 0 30px; font-size:18px; color:#111111; text-align:left; border-right:1px solid white;}
#cmm_snv .box button span {position:absolute; right:20px; top:50%; display:block; width:10px; height:5px; margin-top:-2px; background:url("../img/common/iconNav_btn.png") 0 0 no-repeat;}
#cmm_snv .box div {position:absolute; left:0; top:60px; z-index:9; width:100%; box-sizing:border-box; background:white; border:1px solid #e7e7e7;}
#cmm_snv .box div a {display:block; padding:10px 20px; box-sizing:border-box; font-size:16px; font-family:"notoLight"; color:#959595; border-top:1px solid #e7e7e7;}
#cmm_snv .box div a:first-child {border-top:none;}

#cmm_sub {width:1200px; margin:0 auto;}
#cmm_sub > div {float:left; width:100%; margin:80px 0 100px;}

#cmm_sub h3 {position:relative; float:left; width:100%; padding-bottom:100px; font-size:28px; text-align:center;}
#cmm_sub  h3 span {position:absolute; left:50%; top:62px; display:inline-block; width:60px; height:2px; margin-left:-31px; background:#e95d00;}

.cmm_subCon {float:left; width:100%;}

#cmm_topLink {position:fixed; right:10px; top:50%; margin-top:-25px;}

