
/*head_area*/
.head_area {position: fixed;top:0;width:100%;height:85px;z-index: 150;box-sizing: border-box;max-width: 430px;}
.header_top{width:100%;height: 85px;}
.header_top .wrap_1230 { width:100%;padding:0 20px;box-sizing:border-box;}
.head_area .logo_area{padding-top: 29px;display:inline-block ;}
.head_area .logo {display: inline-block;vertical-align:middle; width:244px; height:32px;}
.head_area .logo a {display:block; width:100%; height:100%; background:url(../img/common/logo.png?ver=230725) no-repeat;background-size:cover;}
.head_mask{width:100%;height: 100%;background: #fff;position: fixed;z-index:120;display:none}
.head_mask.on{display:block}
.head_area .head_bottom{display: none;position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:90%;}
.head_area .head_bottom.active{display: block; position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:100%;}
.head_area .lnb{box-sizing: border-box;padding: 0 30px;}
.head_area .lnb > li{box-sizing: border-box;width:100%;text-align: center;margin-top: 30px;padding-bottom: 29px;border-bottom: 1px solid rgba(188,188,188,0.3);}
.head_area .lnb > li:first-child{margin-top:60px;}
.head_area .lnb > li:last-child{border-bottom: 0;}
.head_area .lnb > li > a {display:block;text-align: center;font-weight:700;font-size:30px;color:#000;position: relative;}
.head_area .lnb > li > a.active h2,.head_area .lnb > li > a.on h2 {border-bottom: 4px solid #006EB8;}
.head_area .lnb > li > a h2{font-size: 23px;display:inline-block;color: #333;padding-bottom: 10px;}
.head_area .lnb_sub {overflow:hidden;position:relative;top:18px;left:0;height:auto;z-index:10;display:none;}
.head_area .lnb_sub > li {margin-bottom:10px;padding:0;}
.head_area .lnb_sub a {display:block;color:#000;font-weight:500;font-size:20px;text-align:center}
.head_area .lnb_sub a.on {color:#00B4E5}
.head_area .lnb_sub_bg {display:none;position:absolute;top:90px;left:0;z-index:1;width:100%;height:auto;background:rgba(255,255,255,0.1);}
.head_area .lnb_sub_bg > a {display:block;width:100%;height:auto;text-indent:-9999px;cursor:default}
.head_area .lnb_sub_bg.on{display: block;}
.head_area.scrollHd{background:#fff;border-bottom: 0;}
.head_area.active{background:rgba(0,0,0,1)}
.btn_site{display: inline-block;font-weight:700;font-size:16px;color:#333333;line-height: 1;position: absolute;right:30px;bottom:30px;box-sizing: border-box;opacity: 0.8;}
.btn_site a{display:inline-block;color:#333333;font-size: 16px;font-weight: 700;}
.btn_site a em{width:34px;height: 10px;background: url(../img/index/ico_site.png) 0 0 no-repeat;margin-left: 5px;display: inline-block;vertical-align: bottom;}
.head_area.active { background:#fff;}
.head_area.scrollHd .logo a,.head_area.active .logo a,.head_area.on .logo a { background:url(../img/common/logo_b.png?ver=230725) no-repeat; background-size:cover;}
.head_area.scrollHd .hamburger .line,.head_area.active .hamburger .line { background:black;}

.hamburger{position: absolute;right:20px;top:28px}
.hamburger .line{width: 40px;height: 4px;background-color: #fff;display: block;margin: 6px auto;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.hamburger:hover{cursor: pointer;}
.hamburger.is-active .line { background:#000;}
.hamburger.is-active .line:nth-child(2){opacity: 0;}
.hamburger.is-active .line:nth-child(1){-webkit-transform: translateY(10px) rotate(45deg);-ms-transform: translateY(10px) rotate(45deg);-o-transform: translateY(10px) rotate(45deg);transform: translateY(10px) rotate(45deg);}
.hamburger.is-active .line:nth-child(3){-webkit-transform: translateY(-10px) rotate(-45deg);-ms-transform: translateY(-10px) rotate(-45deg);-o-transform: translateY(-10px) rotate(-45deg);transform: translateY(-10px) rotate(-45deg);}
