/* skipnavi-box */
.skipnavi-box {position:fixed; left:0; top:0; width:100%; z-index:99999;}
.skipnavi-box dl dt {display:none;}
.skipnavi-box dl dd a {position:absolute; left:0; top:-35px; width:100%; transition:all ease 0.5s; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:35px; background:var(--color-active); color:var(--color-white); font-size:16px; font-weight:600;}
.skipnavi-box dl dd a:focus {top:0;}

/* header */
header {display:flex; flex-wrap:wrap; background:#fff; padding:0 40px; position:fixed; left:0; top:0; width:100%; z-index:9999; transition:all ease 0.5s;}
header h1 a {position:relative; top:25px; display:block; font-size:0; width:174px; height:60px; background:url('../images/logo.png') no-repeat center / cover;}
header .header-cate {flex:1; min-width:0;}
header .header-cate .cate-head {display:none;}
header .header-cate .cate-body > ul {display:flex; flex-wrap:wrap; justify-content:center;}
header .header-cate .cate-body > ul > li > .btn {position:relative; height:110px; padding:0 70px; font-size:20px; font-weight:700; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
header .header-cate .cate-body > ul > li:hover > .btn {color:var(--color-active);}
header .header-cate .cate-body > ul > li:hover > .btn:before {position:absolute; left:0; bottom:0; width:100%; height:3px; content:""; background:var(--color-active);}
header .header-cate .cate-body > ul > li > button.btn {display:none;}
header .header-cate .cate-body > ul > li > ul {display:none; padding:22.5px 0;}
header .header-cate .cate-body > ul > li > ul > li a {display:block; text-align:center; padding:7.5px; font-size:17px; word-break:keep-all; word-break:keep-all; line-height:1.3;}
header .header-cate .cate-body > ul > li > ul > li a:hover {color:var(--color-active); font-weight:600;}
header .header-cate .cate-body > ul > li > ul > li.active a {color:var(--color-active); font-weight:600;}
header .header-cate .cate-body > ul > li.active > .btn {color:var(--color-active);}
header .header-cate .cate-body > ul > li.active > .btn:before {position:absolute; left:0; bottom:0; width:100%; height:3px; content:""; background:var(--color-active);}
header .header-cate .cate-body:hover > ul > li > ul {display:block;}
header .header-button {position:relative; top:25px; display:flex; flex-wrap:wrap;}
header .header-button button {width:60px; height:60px; font-size:0; display:block;} 
header .header-button button.menu {background:url('../images/icon_menu.png') no-repeat center / cover; display:none;}
header .header-button button.qna {background:url('../images/icon_qna.png') no-repeat center / cover;}
header.scroll {box-shadow:0 0 10px rgba(0,0,0,0.1);}
@media (max-width:1750px){
header {padding:0 20px;}
}
@media (max-width:1600px){
header .header-cate .cate-body > ul > li > .btn {padding:0 30px;}
}
@media (max-width:1200px){
header {justify-content:space-between; align-items:center; padding:10px 15px;}
header h1 a {top:0;}
header .header-cate {pointer-events:none; opacity:0; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9999; transition:all ease 0.5s;}
header .header-cate .box {pointer-events:none; opacity:0; position:absolute; right:0; top:0; width:100%; height:100%; background:#fff; transition:all ease 0.5s; display:flex; flex-direction:column;}
header .header-cate .cate-head {padding:10px 15px; background:var(--color-active3); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
header .header-cate .cate-head h2 {font-size:0; display:block; width:174px; height:60px; background:url('../images/logo_w.png') no-repeat center / cover;}
header .header-cate .cate-head .close {width:40px; height:40px; font-size:0; background:url('../images/icon_close.svg') no-repeat center / cover; filter:var(--filter-white);}
header .header-cate .cate-body {width:100%; height:100%; overflow-y:auto;}
header .header-cate .cate-body > ul {display:block;}
header .header-cate .cate-body > ul > li {border-bottom:1px solid #ddd;}
header .header-cate .cate-body > ul > li:last-of-type {border:0;}
header .header-cate .cate-body > ul > li > .btn {justify-content:space-between; height:50px; font-size:16px; padding:0 20px;}
header .header-cate .cate-body > ul > li > .btn:before {display:none !important;}
header .header-cate .cate-body > ul > li > .btn.toggle {display:none;}
header .header-cate .cate-body > ul > li > .btn.toggle ~ button {display:flex; width:100%;}
header .header-cate .cate-body > ul > li > button.btn {color:#000;}
header .header-cate .cate-body > ul > li > button.btn span {color:#000; font-size:16px; flex:1; min-width:0; font-weight:700; text-align:left;}
header .header-cate .cate-body > ul > li > button.btn:after {display:block; content:""; width:24px; height:24px; background:url('../images/icon_arrow_down.svg') no-repeat center / cover;}
header .header-cate .cate-body > ul > li > ul {background:#f4f4f4; padding:15px;}
header .header-cate .cate-body > ul > li > ul > li a {font-size:14px; text-align:left;}
header .header-cate .cate-body > ul > li.active > .btn {background:var(--color-light-active); color:#fff;}
header .header-cate .cate-body > ul > li.active > button.btn:after {filter:var(--filter-white); transform:rotate(180deg);}
header .header-cate .cate-body > ul > li.active > button.btn span {color:#fff;}
header .header-cate .cate-body > ul > li.active > ul {display:block !important;}
header .header-cate .cate-body:hover > ul > li > ul {display:none;}
header .header-button {top:0;}
header.fixed .header-cate {pointer-events:inherit; opacity:1;}
header.fixed .header-cate .box {pointer-events:inherit; opacity:1; right:0;}
}
@media (max-width:991px){
header h1 a {width:140px; height:48.67px;}
header .header-cate .box {right:-25px;}
header .header-cate .cate-head h2 {width:140px; height:48.67px;}
header .header-cate .cate-head .close {width:28px; height:28px;}
header .header-button button {width:40px; height:40px;}
header .header-button button.menu {display:block;}
}

/* footer */
footer {background:#1C1C1C; padding:80px 0;}
footer .container {max-width:1470px; display:flex; flex-wrap:wrap;}
footer .footer-fixed {position:fixed; right:30px; top:50%; transform:translateY(-50%); z-index:1000;}
footer .footer-fixed ul li {margin:0 0 10px;}
footer .footer-fixed ul li:last-of-type {margin:0;}
footer .footer-fixed ul li a {display:block; width:80px; height:140px; font-size:0; background-size:cover; background-position:center;}
footer .footer-fixed ul li:nth-of-type(1) a {background-image:url('../images/icon_footer_fixed_01.png');}
footer .footer-fixed ul li:nth-of-type(2) a {background-image:url('../images/icon_footer_fixed_02.png');}
footer .footer-fixed ul li:nth-of-type(3) a {background-image:url('../images/icon_footer_fixed_03.png');}
footer .footer-fixed ul li:nth-of-type(1) a:hover {background-image:url('../images/icon_footer_fixed_on_01.png');}
footer .footer-fixed ul li:nth-of-type(2) a:hover {background-image:url('../images/icon_footer_fixed_on_02.png');}
footer .footer-fixed ul li:nth-of-type(3) a:hover {background-image:url('../images/icon_footer_fixed_on_03.png');}
footer .footer-left {margin:0 130px 0 0;}
footer .footer-left h2 {margin:0 0 20px;}
footer .footer-left h2 img {width:162px;}
footer .footer-left p {font-size:16px; color:rgba(255,255,255,0.3); word-break:keep-all;}
footer .footer-left ul {margin:30px 0;}
footer .footer-left ul li {margin:0 0 10px; display:flex; flex-wrap:wrap;}
footer .footer-left ul li:last-of-type {margin:0;}
footer .footer-left ul li:before {display:inline-block; content:""; width:19px; height:24px; margin:0 10px 0 0; background-size:19px auto; background-position:left center; background-repeat:no-repeat;}
footer .footer-left ul li p {flex:1; min-width:0; font-size:16px; color:#fff;}
footer .footer-left ul li:nth-of-type(1):before {background-image:url('../images/icon_footer_left_01.svg');}
footer .footer-left ul li:nth-of-type(3):before {background-image:url('../images/icon_footer_left_02.svg');}
footer .footer-left ul li:nth-of-type(4):before {background-image:url('../images/icon_footer_left_03.svg');}
footer .footer-right {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-content:space-between;}
footer .footer-right > div {width:100%;}
footer .footer-right .right-us {display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;}
footer .footer-right .right-us > h3 {font-size:16px; color:#fff; margin:0 24px 0 0;}
footer .footer-right .right-us > ul {display:flex; flex-wrap:wrap; align-items:center; gap:0 15px; margin:0 40px 0 0;}
footer .footer-right .right-us > ul li a {display:block; font-size:0; width:16px; height:16px; background-position:center; background-repeat:no-repeat; background-size:auto 16px;}
footer .footer-right .right-us > ul li:nth-of-type(1) a {background-image:url('../images/icon_footer_us_01.png');}
footer .footer-right .right-us > ul li:nth-of-type(2) a {background-image:url('../images/icon_footer_us_02.png');}
footer .footer-right .right-us > ul li:nth-of-type(3) a {background-image:url('../images/icon_footer_us_03.png');}
footer .footer-right .right-us > a {font-size:16px; color:#fff; margin:0 40px 0 0;}
footer .footer-right .right-us > button {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; background:#4C4C4C; height:48px; border-radius:10px; padding:0 20px; font-size:18px; color:#fff;}
footer .footer-right .right-us > button:after {display:block; content:""; width:20px; height:20px; margin:0 0 0 5px; background:url('../images/icon_arrow_up.svg') no-repeat center / cover; filter:var(--filter-white);}
footer .footer-right .right-news h3 {font-size:24px; font-weight:700; color:#fff; margin:0 0 20px;}
footer .footer-right .right-news p {font-size:16px; color:rgba(255,255,255,0.3); word-break:keep-all; margin:0 0 20px;}
footer .footer-right .right-news form {display:flex; flex-wrap:wrap; align-items:center;}
footer .footer-right .right-news form input {flex:1; min-width:0; height:60px; background:#565656; color:#fff; padding:0 20px; color:#fff;}
footer .footer-right .right-news form button {margin:0 0 0 10px; display:flex; flex-wrap:wrap; align-items:center; height:60px; padding:0 20px; font-size:18px; color:#fff; background:#3356EF;}
@media (max-width:1300px){
footer .footer-left {margin:0 60px 0 0;}
}
@media (max-width:991px){
footer {padding:40px 0;}
footer .footer-fixed {right:15px;}
footer .footer-fixed ul li {margin:0 0 5px;}
footer .footer-fixed ul li a {width:40px; height:70px;}
footer .footer-left {width:100%; margin:0 0 30px;}
footer .footer-left h2 {margin:0 0 10px;}
footer .footer-left h2 img {width:140px;}
footer .footer-left p {font-size:13px;}
footer .footer-left ul {margin:15px 0;}
footer .footer-left ul li {margin:0 0 5px;}
footer .footer-left ul li:before {width:14px; height:19px; margin:0 5px 0 0; background-size:14px auto;}
footer .footer-left ul li p {font-size:13px;}
footer .footer-right {flex:none; width:100%;}
footer .footer-right .right-us {justify-content:flex-start; border-bottom:1px dashed rgba(255,255,255,0.2); margin:0 0 20px; padding:0 0 20px;}
footer .footer-right .right-us > h3 {font-size:18px; width:100%; margin:0 0 10px;}
footer .footer-right .right-us > ul {gap:0 15px; margin:0 20px 0 0;}
footer .footer-right .right-us > ul li a {width:20px; height:20px; background-size:auto 20px;}
footer .footer-right .right-us > a {font-size:14px;}
footer .footer-right .right-us > button {position:fixed; right:15px; bottom:15px; z-index:100; font-size:0; padding:0; width:40px; height:40px; border-radius:5px;}
footer .footer-right .right-us > button:after {margin:0;}
footer .footer-right .right-news h3 {font-size:18px; margin:0 0 10px;}
footer .footer-right .right-news p {font-size:13px;}
footer .footer-right .right-news form input {height:45px; padding:0 10px; font-size:14px;}
footer .footer-right .right-news form button {margin:0 0 0 5px; height:45px; padding:0 10px; font-size:14px;}
}

/* section */
section {margin:110px 0 0; padding:0 0 100px;}
@media (max-width:1200px){
section {margin:80px 0 0; padding:0 0 80px;}
}
@media (max-width:991px){
section {margin:68.66px 0 0; padding:0 0 50px;}
}

/* banner-top-box */
.banner-top-box {margin:0 0 100px; padding:80px 0; background-size:cover; background-position:center;}
.banner-top-box.cate01 {background-image:url('../images/bg_banner_top_01.png');}
.banner-top-box.cate02 {background-image:url('../images/bg_banner_top_02.png');}
.banner-top-box.cate03 {background-image:url('../images/bg_banner_top_03.png');}
.banner-top-box.cate04 {background-image:url('../images/bg_banner_top_04.png');}
.banner-top-box.cate05 {background-image:url('../images/bg_banner_top_05.png');}
.banner-top-box.cate06 {background-image:url('../images/bg_banner_top_06.png');}
.banner-top-box.cate07 {background-image:url('../images/bg_banner_top_07.png');}
.banner-top-box.cate08 {background-image:url('../images/bg_banner_top_08.png');}

.banner-top-box h2 {text-align:center; font-size:40px; font-weight:700; color:#fff;}
.banner-top-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:15px 0 0;}
.banner-top-box ul li {display:flex; flex-wrap:wrap; align-items:center; font-size:16px; color:#fff;}
.banner-top-box ul li:after {display:inline-block; content:""; width:16px; height:16px; margin:0 10px; background:url('../images/icon_arrow_right.svg') no-repeat center / cover; filter:var(--filter-white);}
.banner-top-box ul li:last-of-type:after {display:none;}
@media (max-width:991px){
.banner-top-box {margin:0 0 50px; padding:50px 0;}
.banner-top-box h2 {font-size:30px;}
.banner-top-box ul {display:none;}
}