/*body, html {scroll-behavior: smooth; font-size: 16px; letter-spacing: -0.025em; font-family: 'Pretendard', sans-serif !important; min-width: 1600px; width: 100%; position: relative;}*/
body, html {scroll-behavior: smooth; font-size: 16px; letter-spacing: -0.025em; font-family: 'Pretendard', sans-serif !important; min-width: 1600px; width: 100%; position: relative;}
.inner, .container {min-width: 1600px; margin: 0 auto; max-width: 1600px; width: 100%;}
.s_container {min-width: 1600px; margin: 0 auto; max-width: 1600px; width: 100%; padding: 0 50px; box-sizing: border-box;}
.blind {font-size: 0; text-indent: -9999px; opacity: 0;}

@media all and (max-width: 1640px) {
  body, html {min-width: 0; max-width: 100%; }
  .inner, .container {min-width: 0; max-width: 100%; padding: 0 20px; box-sizing: border-box;}
  .s_container {min-width: 0; max-width: 100%; padding: 0 20px; box-sizing: border-box;}
}

@media all and (max-width: 1024px) {

}

@media all and (max-width: 640px) {

}

b {font-weight:800; color: var(--txt-c2);}

:root {
  --m-color: #145adb;
  --m-color-70: rgba(20, 90, 219, 0.7);
  --m-color-80: rgba(20, 90, 219, 0.8);
  --txt-c9: #999;
  --txt-c8: #888;
  --txt-c6: #666;
  --txt-c2: #222;
  --txt-c3: #333;
  --txt-c0: #000;
  --border: #ddd;
  --border-ff: #f8f8f8;
  --border-ee: #e9e9e9;
  --border-cc: #ccc;
  --border-99: #999;

  --m-error: #d43d60;
  --m-new: #fca604;
  --m-pop: #32c081;
  --m-rec: #fa647d;
  --m-sale:#ec3f3f;
  --m-ing: #00a4a2;
  --m-best: #00a4a2;
  --m-end: #8f8f99;
  --m-ready: #f58604;
}

#header {z-index: 20; width: 100%; height: 90px; background: #fff; border-bottom: 1px solid #ddd; box-sizing: border-box; position: sticky; top:0; left:0;}
#header .header__container {width: 100%; height: 100%; position: relative; }
#header .header_wrap {width: 100%; height: 100%; position: relative;}
#header .dim {display: none; width: 100%; background: #fff; position: absolute; top: 90px; left: 0; height: 240px; z-index: 21; border-bottom: 1px solid var(--border-ff); box-sizing: border-box;}
#header.show .dim {display: block;}
#header .container {position: relative; height: 100%;}
#header .logo {position: absolute; top: 12px; left: -120px; width: 93px; height: 46px;}
#header .logo a {display: block; width: 100%; height: 100%; background: url(/EN/img/comm/logo.png) 50% 50% no-repeat; background-size: 100% auto;}
#header nav {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100%; z-index: 22; width: 630px; display: block;}
#header .gnb {display: flex; justify-content: center; align-items: center; height: 100%;}
#header .gnb > li {height: 100%; position: relative; flex: none;}
#header .gnb > li > a {display: flex; justify-content: center; align-items: center; height: 100%; font-size: 20px; font-weight: 800; color: #000; padding: 0 18px; box-sizing: border-box; position: relative;}
#header .gnb > li > a::after {transition: all 0.3s ease; content : ''; display: block; width: calc(100% - 36px); height: 3px; background: transparent; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%);}
#header .gnb > li.active > a::after {background: var(--m-color);}
#header .gnb > li:first-of-type > a {padding-left: 0;}
#header .gnb > li:first-of-type > a::after {width: calc(100% - 18px); left: 0; transform: translateX(0);}
#header .gnb > li:last-of-type > a {padding-right: 0;}
#header .gnb > li:last-of-type > a::after {width: calc(100% - 18px); left: 18px; transform: translateX(0);}
#header .gnb > li > .depth2 {display: flex; justify-content: flex-start; align-items: flex-start; position: absolute; top: calc(100% + 18px); left: 50%; transform: translate(-50%, 0); opacity: 0; visibility: hidden;}
#header .gnb > li:last-of-type .depth2 {left: 55%;}
#header .gnb > li > .depth2.down {flex-direction: column;}
#header .gnb > li > .depth2 > li {position: relative; margin: 0 46px 0 0;}
#header .gnb > li > .depth2.down > li {margin: 0 0 20px;}
#header .gnb > li > .depth2 > li:last-of-type {margin-right: 0;}
#header .gnb > li .depth2 > li > a {display: block; color: var(--txt-c0); font-size: 15px; font-weight: 800; box-sizing: border-box; white-space: nowrap;}
#header .gnb > li.active > .depth2 {opacity: 1; visibility: visible;}

#header .gnb > li .depth2 .depth3 {padding: 10px 0 0; box-sizing: border-box;}
#header .gnb > li .depth2 .depth3 li a {white-space: nowrap; font-size: 13px; color: var(--txt-c6); font-weight: 700; line-height: 30px; position: relative; padding: 0 0 0 10px; box-sizing: border-box;}
#header .gnb > li .depth2 .depth3 li a::before {content: ''; width: 5px; height: 5px; background: var(--txt-c6); border-radius: 50%; display: block; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
#header .gnb > li .depth2 .depth3 li a:hover {color: var(--m-color);}
#header .gnb > li .depth2 .depth3 li a:hover::before {background: var(--m-color);}


#header .container .utils {z-index: 9999; position: absolute; top: 50%; right: 28px; transform: translateY(-50%); display: flex; justify-content: flex-start; align-items: center; z-index: 24;}
#header .container .utils dd a {color: var(--txt-c9); font-weight: 800;}
#header .container .utils.user_utils {right: 190px;}
#header .container .utils.user_utils dd + dd {margin: 0 0 0 18px;}
#header .container .utils.user_utils a {font-size: 15px;}
#header .container .utils.lang_utils dd + dd {margin: 0 0 0 12px;}
#header .container .utils.lang_utils dd a {font-size: 16px;}
#header .container .utils.lang_utils dd.active a {color: var(--m-color);}
#header .dir__logis {color: #fff; font-weight: 800;  display: flex; flex-wrap: wrap; position: absolute; left: calc(50% + 881px); top: 50%; transform: translate(-50%, -50%); justify-content: center; align-content: center; align-items: center; text-align: center; width: 160px; height: 90px; background: var(--m-color);}
#header .dir__logis h4 {width: 100%; font-size: 20px; margin: 0 0 15px;}
#header .dir__logis p {width: 100%; font-size: 10px;}
#header .dir__logis p i {transition: all 0.3s ease; display: inline-block; width: 26px; height: 11px; background-image: url(/img/comm/header__arrow.png); margin: 0 0 0 18px; vertical-align: middle;}
#header .dir__logis:hover p i {transform: translateX(10px);}

#header .all-menu-open {display: none; position: absolute; top: 50%; transform: translateY(-50%); right: 20px; z-index: 28; width: 25px; height: 22px; background: url(/logis/img/comm/all_menu.png) 50% 50% no-repeat; background-size: 100% auto;}
#header .all-menu-cls {display: none; position: fixed; top: 24px; right: 20px; z-index: 32; width: 20px; height: 20px; background: url(/logis/img/comm/all_menu_cls.png) 50% 50% no-repeat; background-size: 100% auto;}

#header .container .utils.lang_utils dt.blind {display: block; width: 24px; height: 24px;  opacity: 1; visibility: visible; text-indent: 0; cursor: pointer; background: #fff url(/logis/img/comm/world.png) 50% 50% no-repeat; background-size: 100% auto;}
#header .container .utils.lang_utils::after {border: 1px solid #eee; box-sizing: border-box; content: ''; display: none; width: 100px; border-radius: 12px;
  background: #fff; height: 80px; position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); z-index: 24;}
#header .container .utils.lang_utils dd {display: none; text-align: center; position: absolute; top: calc(100% + 30px); width: 100px; left: 50%; transform: translateX(-50%); z-index: 25;}
#header .container .utils.lang_utils dd + dd {margin: 0; top: calc(100% + 54px);}
#header .container .utils.lang_utils.active::after {display: block;}
#header .container .utils.lang_utils.active dd {display: block;}

@media all and (max-width: 1920px) {
  #header .container {display: flex; justify-content: space-between; align-items: center; padding: 0 !important; width: 100%; max-width: 100%; min-width: 0;}
  #header .container .logo {left: 20px; }
  #header .dir__logis {left: initial; right: 0; transform:  translate(0, -50%);}
  #header nav {width: 760px; left: 48%;}
  #header .container .utils {right: 180px;}
  #header .container .utils.user_utils {right: 300px;}
  #header .container .logo {left: 20px; }

}

@media all and (max-width: 1640px) {
  #header .header_wrap {}
  #header .container .utils {display: block;}
  #header .container .utils::after {border: 1px solid #eee; box-sizing: border-box; content: ''; display: none; width: 100px; border-radius: 12px; background: #fff; height: 80px; position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); z-index: 24;}
  #header .container .utils dd {display: none; text-align: center; position: absolute; top: calc(100% + 30px); width: 100px; left: 50%; transform: translateX(-50%); z-index: 25;}
  #header .container .utils.user_utils {right: 180px;}
  #header .container .utils.lang_utils {right: 140px;}
  #header .container .utils dt.blind {display: block; width: 24px; height: 24px;  opacity: 1; visibility: visible; text-indent: 0; cursor: pointer;}
  #header .container .utils.user_utils dt.blind {background: #fff url(/logis/img/comm/user.png) 50% 50% no-repeat; background-size: 100% auto;}
  #header .container .utils.user_utils dd + dd {margin: 0; top: calc(100% + 54px);}
  #header .container .utils.lang_utils dd + dd {margin: 0; top: calc(100% + 54px);}
  #header .container .utils.active::after {display: block;}
  #header .container .utils.active dd {display: block;}

  #header .gnb > li > a{font-size: 18px;}
  #header nav {left: 49%;}

  #header .dir__logis {width: 120px;}
  #header .dir__logis h4 {font-size: 16px;}

}
@media all and (max-width: 1280px) {
  #header .container .utils dt.blind {width: 20px; height: 20px;}
}

@media all and (max-width: 1180px) {
  #header nav {left: 50%;}

  #header .gnb > li > a{font-size: 16px;}
  #header .gnb > li > a {padding: 0 12px;}

  #header .container .utils.user_utils {right: 190px;}
  #header .container .utils.lang_utils {right: 150px;}

}


@media all and (max-width: 1024px) {
  #header {height: 70px; position: fixed;}
  #header .container .logo {height: 36px; left: 0;}
  #header .container .logo a {background-size: auto 100%;}
  #header nav {display: none; padding: 114px 20px 20px; box-sizing: border-box; position: fixed; width: 370px; height: calc(100% - 60px); overflow-y: auto; top: 0; right: 0; transform: initial; left: initial; z-index: 31;}
  #header .dim {display: none; position: fixed; width: 370px; height: 100vh; top: 0; right: 0; transform: initial; left: initial; z-index: 30; background: #fff;}
  #header .gnb {display: block;}
  #header .gnb > li {height: auto;}
  #header .gnb > li > a {border-bottom: 1px solid #4d4d4d; padding: 10px 8px; box-sizing: border-box; height: auto; color: #fff; text-align: left; justify-content: flex-start;
    background: url(/logis/img/comm/all-menu-down.png) calc(100% - 8px) 50% no-repeat; font-size: 18px;}
  #header .gnb > li:first-of-type > a {padding: 10px 8px;  border-top: 0;}
  #header .gnb > li:last-of-type > a {padding: 10px 8px;}
  #header .gnb > li > .depth2 {position: initial; display: none;}
  #header .gnb > li > .depth2.down > li {margin: 0;}
  #header .gnb > li.on > a {background: url(/logis/img/comm/all-menu-on.png) calc(100% - 8px) 50% no-repeat}
  #header .gnb > li.on > .depth2 {display: block; visibility: visible; opacity: 1; border-bottom: 1px solid #4d4d4d; box-sizing: border-box;transform: none;}
  #header .gnb > li .depth2 > li > a {color: #fff; position: relative; display: block; width: 100%; padding: 0 18px; box-sizing: border-box; line-height: 33px; font-size: 14px;}
  #header .gnb > li .depth2 > li > a::before {content : ''; display: block; width: 5px; height: 5px; background: #fff; border-radius: 50%; position: absolute; top: 14px; left: 8px;}
  #header .gnb > li .depth2 .depth3 {padding: 0;}
  #header .gnb > li .depth2 .depth3 li a {font-size: 15px; line-height: 28px; display: block; width: 100%; color: rgba(255, 255, 255, 0.3); padding: 0 24px; box-sizing: border-box;}
  #header .gnb > li .depth2 .depth3 li a::before {width: auto; height: auto; content: '-'; background: transparent; left: 11px;}

  #header .container .utils {display: none; justify-content: flex-start; align-items: center; position: fixed; transform: initial; width: 330px; z-index: 35; padding: 0 0 0 20px; box-sizing: border-box;}
  #header .container .utils.user_utils {top: 28px; right: 40px; }
  #header .container .utils.lang_utils {top: 70px; right: 20px; justify-content: flex-end;}
  #header .container .utils.user_utils dt.blind {background: transparent;}
  #header .container .utils.lang_utils dt.blind {background: transparent;}
  #header .container .utils dt.blind {display: none; width: 0; height: 0;}
  #header .container .utils dd {display: block; position: initial; transform: initial; width: auto;}
  #header .container .utils.lang_utils dd {display: block; position: initial; transform: initial; width: auto;}
  #header .container .utils.user_utils dd + dd {margin: 0 0 0 14px;}
  #header .container .utils.lang_utils dd + dd {margin: 0 0 0 14px;}
  #header .container .utils dd a {color: #fff; text-align: left;}
  #header .all-menu-open {display: block;}
  #header.tb-menu nav {display: block;}
  #header.tb-menu .dim {display: block; background: #000;}
  #header.tb-menu .container .utils {display: flex;}

  #header .gnb > li .depth2 .depth3 li a:hover {color: var(--txt-c6);}
  #header .gnb > li .depth2 .depth3 li a:hover::before {background: transparent;}

  #header .dir__logis {width: 110px; height: 25px; right: 55px; text-align: left; padding: 0 10px; box-sizing: border-box; background: var(--m-color) url(/m/img/comm/go_dir.png) calc(100% - 10px) 50% no-repeat;}
  #header .dir__logis h4 {margin: 0; font-size: 12px;}
  #header .dir__logis p {display: none;}

  #header .container .logo {height: 33px; top: 40%; transform: translateY(-50%);}
  #header .logo a {background-position: 12px 50%;}

  #header .container .utils.active::after {content: initial;}
}


@media all and (max-width: 640px) {
}

@media all and (max-width: 375px) {
  #header .container .utils {width: calc(100% - 40px);}
  #header nav {width: 100%;}
  #header.tb-menu .dim {width: 100%;}
  #header .container .logo {height: 28px; }
  #header .all-menu-open {right: 16px;}
}



#footer {width: 100%; border-top: 1px solid var(--border-ee);}
#footer .footer__menu {display: flex; justify-content: flex-start; align-items: center; position: relative; padding: 20px 0; box-sizing: border-box;}
#footer .footer__menu .partner__btn {margin: 0; position: absolute; right: 0; bottom: 20px; }
#footer .footer__menu .partner__btn > a {display: block; padding: 0 32px 0 0; box-sizing: border-box; background: #fff url(/img/comm/partner__arrow.png) right 50% no-repeat;}
#footer .footer__menu > li {margin: 0 18px 0 0;}
#footer .footer__menu > li:first-of-type {margin: 0 18px 0 6px;}
#footer .footer__menu > li a {color: var(--txt-c0); font-weight: 500; font-size: 15px;}
#footer .partner__list {z-index: 22; display: block; position: absolute; top: 0; left: 0; width: 100%; opacity: 0; visibility: hidden; transition: top 0.3s linear, opacity 0.3s ease-in-out;}
#footer .partner__list.on {padding: 15px; box-sizing: border-box; background: #000; opacity: 1; visibility: visible; top: calc(100% + 12px);}
#footer .partner__list li a {font-size: 13px; color: #fff; font-weight: 400; white-space: nowrap; line-height: 28px; position: relative; padding: 0 0 0 8px; box-sizing: border-box;}
#footer .partner__list li a:hover {color: var(--m-color);}
#footer .partner__list li a::before {content: ''; display: block; width: 3px; height: 3px; border-radius: 50%; background: #fff; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
#footer .partner__list li a:hover::before {background: var(--m-color);}

@media all and (max-width: 1024px) {
  #footer { background: rgba(245, 245, 245, 0.9); }
  #footer .footer__menu {align-content: flex-start; flex-wrap: wrap;}
  #footer .footer__menu > li {width: 50%; flex: none; margin: 0; padding: 0;}
  #footer .footer__menu > li:first-of-type {margin: 0 0 0 0;}
  #footer .footer__menu > li:nth-of-type(2n) {padding: 0 0 0 0;}
  #footer .footer__menu > li a {font-size: 15px; font-weight: 500; color: rgba(0, 0, 0, 0.7); line-height: 30px;}
  #footer .footer__menu .partner__btn {margin: 16px 0 0; position: initial; display: block; width: 100%; }
  #footer .footer__menu .partner__btn > a {height: 44px; border-radius: 20px; background: #000 url(/m/img/comm/family__btn_off.png) calc(100% - 16px) 50% no-repeat; padding: 0 16px; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center; width: 100%; font-size: 13px; color: #fff; font-weight: 300;}
  #footer .footer__menu .partner__btn.on > a {background: #000 url(/m/img/comm/family__btn.png) calc(100% - 16px) 50% no-repeat;}

  #footer .partner__list {border-radius: 20px; padding: 22px 0 22px 32px; box-sizing: border-box; width: calc(100% - 14px); background: #fff !important; position: absolute; border: 1px solid #000;}
  #footer .partner__list.on {bottom: 78px !important; left: 4px; top: initial !important; }
  #footer .partner__list li a {font-size: 15px; color: var(--txt-c4); font-weight: 700; line-height: 30px;}
  #footer .partner__list li a::before {background: #000 !important;}
  #footer .partner__list li a:hover::before {background: #000 !important;}

}

#footer .bg {background: rgba(245, 245, 245, 0.9); border-top: 1px solid var(--border-ee); box-sizing: border-box; padding: 32px 0 60px;}
#footer .container {position: relative;}
#footer .foot_logo {width: 93px; height: 46px;     background: url(/EN/img/comm/foot__logo.png) 0 50% no-repeat; background-size: auto 100%;}
#footer .footer__sns {margin: 26px 0 24px; display: flex; justify-content: flex-start; align-items: center;}
#footer .footer__sns li {margin: 0 12px 0 0;}
#footer .footer__sns li i {display: block;}
#footer .footer__sns li .instagram {background-image: url(/img/comm/foot__sns_instagram.png); width: 21px; height: 21px;}
#footer .footer__sns li .blog {background-image: url(/img/comm/foot__sns_blog.png); width: 26px; height: 22px;}
#footer .footer__sns li .youtube {background-image: url(/img/comm/foot__sns_youtube.png); width: 25px; height: 18px;}
#footer .footer__sns li .facebook {background-image: url(/img/comm/foot__sns_facebook.png); width: 10px; height: 18px;}
#footer address {font-size: 13px; font-weight: 400; color: var(--txt-c0); opacity: 0.7; line-height: 20px;}
#footer .copy {margin: 14px 0 0; font-size: 12px; color: var(--txt-c0); opacity: 0.4; line-height: 28px; font-weight: 400;}
#footer .footer__center {position: absolute; right: 0; bottom: 25px; z-index: 20; text-align: right;}
#footer .go-top__btn {display: inline-block; width: 74px; height: 74px; border-radius: 50%; background-image: url(/img/comm/go__top.png);}
#footer .footer__center h4 {margin: 22px 0 8px; font-size: 50px; font-weight: 800; color: var(--m-color);}
#footer .footer__center p {font-size: 20px; font-weight: 300; color: var(--txt-c0);}

@media all and (max-width: 1024px) {
  #footer .bg {border: 0; padding: 0 0 40px;}
  #footer .foot_logo {display: none;}
  #footer .go-top__btn {display: none;}
  #footer .footer__center {display: none;}
  #footer address {display: none;}
  #footer .footer__sns {margin: 12px 0 24px;}

}


#lnb {display: flex; justify-content: flex-start; align-items: center; width: 100%; background: var(--m-color); height: 80px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
#lnb > li {flex: none; height: 100%; position: relative;}
#lnb > li::after {content : ''; width: 1px; height: 19px; background: #fff; opacity: 0.5; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
#lnb > li > span {cursor: pointer; background: url(/img/comm/lnb_arrow.png) calc(100% - 20px) 50% no-repeat; color: #fff; font-size: 20px; font-weight: 500; display: flex; justify-content: flex-start; align-items: center; padding: 0 20px; box-sizing: border-box; height: 100%;}
#lnb > li > a {display: block; padding: 0 20px; box-sizing: border-box;}
#lnb .depth2 {box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.15); display: none; position: absolute; top: 100%; width: 100%; background: #fff; left: 0;}
#lnb .depth2.show {display: block;}
#lnb .depth2 li {height: 56px; border-bottom: 1px solid #f2f2f2; box-sizing: border-box;}
#lnb .depth2 li a {display: flex; justify-content: flex-start; align-items: center; height: 100%; padding: 0 0 0 28px; box-sizing: border-box; font-size: 16px; color: var(--txt-c6); font-weight: 500;}
#lnb li.home {margin: 0 0 0 30px; display: flex; justify-content: center; align-items: center;}
#lnb li.home a {width: 57px; height: 57px; background: url(/img/comm/lnb_home.png) 50% 50% no-repeat;}
#lnb li.sub-01 {width: 270px;}
#lnb li.sub-02 {width: 340px;}
#lnb li.sub-03 {width: 270px;}

@media all and (max-width: 1024px){
  #lnb {transform: initial; padding: 0 20px 0 0; box-sizing: border-box; left: 20px; height: 60px; width: calc(100% - 40px);}
  #lnb > li {flex: none; position: relative; width: auto;}
  #lnb > li.home {width: 60px; height: 100%; margin: 0;}
  #lnb > li.home::after {content: initial;}
  #lnb li.home a {width: 100%; height: 100%; display: block; font-size: 0;}
  #lnb li.sub-01 {width: calc(((100% - 60px) / 2) - 9px); height: 100%; max-width: 200px;}
  #lnb li.sub-02 {width: calc(((100% - 60px) / 2) + 9px); height: 100%; max-width: 200px;}
  #lnb li.sub-01 > span,
  #lnb li.sub-02 > span {width: 100%; height: 100%; display: flex; justify-content: flex-start; align-items: center; color: #fff; font-size: 16px; font-weight: 500;}
  #lnb li.sub-01 > span {padding: 0 10px 0 0; box-sizing: border-box; position: relative; background: url(/m/img/comm/lnb_current_arrow.png) calc(100% - 10px) 50% no-repeat;}
  #lnb li.sub-01 > span::after {content : ''; width: 1px; height: 19px; background: rgba(255, 255, 255, 0.5); position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
  #lnb li.sub-02 > span {padding: 0 0 0 10px; box-sizing: border-box;  background: url(/m/img/comm/lnb_current_arrow.png) 100% 50% no-repeat;}
  #lnb li.sub-02::after {content: initial;}
  #lnb .depth2 > li > a {font-size: 14px; padding: 15px 0 15px 20px; line-height: 1.2; word-break: keep-all; color: var(--txt-c1); font-weight: 500; display: block; box-sizing: border-box; border-bottom: 1px solid #f2f2f2;}
  #lnb .depth2 > li > a span {font-size: 12px; display: block;}
  #lnb .sub-01 .depth2 > li {height: 48px;}
  #lnb .sub-01 .depth2 > li > a {/*padding: 0 0 0 20px;*/ padding: 15px 0 15px 20px;}
  #lnb .depth2 {box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.15); display: none; padding: 6px 0 0; box-sizing: border-box; position: absolute; top: 100%; z-index: 103; background: #fff; left: 0; }
  #lnb .depth2.show {display: block;}
  #lnb .sub-01 .depth2 {width: calc(100% + 18px); left: -18px;}
  #lnb .sub-02 .depth2 {width: calc(100% + 10px);}
}

@media all and (max-width: 640px) {
  #lnb {height: 50px; padding: 0 10px 0 0;}
  #lnb > li.home {width: 36px; }
  #lnb li.home a {background-size: 40% auto;}
  #lnb li.sub-01 {max-width: 141px; width: calc(((100% - 36px) / 2) - 9px);}
  #lnb li.sub-02 {max-width: 159px; width: calc(((100% - 36px) / 2) - 9px);}
  #lnb li.sub-01 > span,
  #lnb li.sub-02 > span {font-size: 14px;}
}

#sub_visual {z-index: 19; width: 100%; height: 330px; position: relative;}
#sub_visual .bg {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; text-align: center; box-sizing: border-box; color: #fff;}
#sub_visual .bg h3{font-size: 50px; font-weight: 800; width: 100%; margin: 0 0 20px;}
#sub_visual .bg p{font-size: 18px; font-weight: 800; width: 100%;}
#sub_visual .container {position: absolute; bottom: -25px; left: 50%; transform: translateX(-50%); height: 50px; }

#sub_visual .bg.company {background: url(../img/sub/s_bg_company.jpg) 50% 50% no-repeat; background-size: cover;}
#sub_visual .bg.bs {background: url(../img/sub/s_bg_bs.jpg) 50% 50% no-repeat; background-size: cover;}
#sub_visual .bg.dc {background: url(../img/sub/s_bg_dc.jpg) 50% 50% no-repeat; background-size: cover;}
#sub_visual .bg.csrt {background: url(../img/sub/s_bg_csrt_new.jpg) 50% 50% no-repeat; background-size: cover;}
#sub_visual .bg.ccsc {background: url(../img/sub/s_bg_ccsc_new.jpg) 50% 50% no-repeat; background-size: cover;}
#sub_visual .bg.service {background: url(../img/sub/s_bg_service.jpg) 50% 50% no-repeat; background-size: cover;}


@media all and (max-width: 1024px) {
  #sub_visual {height: 220px; position: relative;}
  #sub_visual .bg {text-align: center; color: #fff; width: 100%; height: 100%;  padding: 0 20px; box-sizing: border-box; display: block; justify-content: initial; align-items: initial; align-content: initial;}
  #sub_visual .bg h3 {margin: 0; padding: 108px 0 0; width: 100%; box-sizing: border-box; font-size: 25px; font-weight: 900; word-break: keep-all;}
  #sub_visual .bg p {font-size: 12px; margin: 8px 0 0; word-break: keep-all; letter-spacing: 0; line-height: 16px;}

}

.s_wrap {width: 100%; padding: 90px 0 120px; box-sizing: border-box;}
.s_wrap .s_tit {text-align: center; margin: 0 0 92px;}
.s_wrap .s_tit_half {margin: 0 0 46px;}
.s_wrap .s_tit h2 {font-size: 40px; font-weight: 800;}
.s_wrap .s_tit p {margin: 30px 0 0; font-size: 17px; color: var(--txt-c6); font-weight: 300; line-height:1.3; letter-spacing: 0;}
.s_wrap .s_tit p b {font-weight: 800; color: var(--txt-c0); display: block; margin: 0 0 10px;}

@media all and (max-width: 1024px) {
  .s_wrap {width: 100%; padding: 78px 0; box-sizing: border-box;}
  .s_wrap.s_wrap_half {padding: 44px 0 78px;}
  .s_wrap .s_tit {text-align: center; margin: 0 auto 50px; /*max-width: 345px;*/}
  .s_wrap .s_tit_half {margin: 0 auto 25px;}
  .s_wrap .s_tit_min {margin: 0 auto 16px;}
  .s_wrap .s_tit h2 {font-size: 25px; font-weight: 800; word-break: keep-all; color: var(--txt-c4);}
  .s_wrap .s_tit p {margin: 10px 0 0; /*font-size: 14px; color: var(--txt-c1); font-weight: 300;*/ letter-spacing: 0; line-height: 21px; word-break: keep-all;}
  .s_wrap .s_tit p b {font-weight: 800; color: var(--txt-c4); display: block; font-size-adjust: 15px;}
}

@media all and (max-width: 510px) {
  .s_wrap .s_tit p br {display: none;}
  .s_wrap .s_tit {max-width: 345px;}
}

.only_chk {}
.only_chk.flex_center_only_chk {display: flex; justify-content: center; align-items: center;}
.only_chk input[type=checkbox] {appearance: none !important; width: 0; margin: 0; padding: 0; height: 0; font-size: 0; line-height: 0;}
.only_chk input[type=checkbox] + label {border-radius: 4px; display: block; width: 18px; height: 18px; background: #fff url(/img/icon/chk_off.png) 50% 50% no-repeat; background-size: 72.22% auto; border: 1px solid #ddd; box-sizing: border-box;}
.only_chk input[type=checkbox]:checked + label {background: var(--m-color) url(/img/icon/chk_on.png) 50% 50% no-repeat; background-size: 72.22% auto; border-color: var(--m-color); }
.only_chk.font input[type=checkbox] + label {line-height: 1; margin: 0; font-size: 16px; width: auto; position: relative; padding: 0 0 0 24px; box-sizing: border-box; border: 0; background: transparent;}
.only_chk.font input[type=checkbox] + label::before {position: absolute; top: 0; left: 0; content: ''; border-radius: 4px; display: block; width: 16px; height: 16px; background: #fff url(/img/icon/chk_off.png) 50% 50% no-repeat; background-size: 72.22% auto; border: 1px solid #ddd; box-sizing: border-box;}
.only_chk.font input[type=checkbox]:checked + label::before {background: var(--m-color) url(/img/icon/chk_on.png) 50% 50% no-repeat; background-size: 72.22% auto; border-color: var(--m-color);}


.pager a {width: 30px; height: 30px; display: inline-block; overflow: hidden; vertical-align: middle; margin: 0 2px;}
.pager .num {line-height: 28px;}
.pager a img {display: inline-block; width: 100%; height: 100%; vertical-align: middle;}
.pager b {width: auto; margin: 0 2px; height: 30px; display: inline-block; vertical-align: middle; min-width: 30px; background: #333; color: #fff;}


#sitemap {overflow: auto; display: none; width: 100%; max-height: 100vh; height: 100vh; background: #100c0b; position: fixed; top: 0; left: 0; z-index: 99; padding: 80px 0 0; box-sizing: border-box;}
#sitemap .sitemap__cls {display: block; width: 24px; height: 24px; background: url(/img/comm/sitemap__cls.png) 50% 50% no-repeat; background-size: 100% auto; position: absolute; top: 20px; right: 20px;}
#sitemap .container{position: relative;}
#sitemap h3 {text-align: center;}
#sitemap h3 img {display: inline-block;}
#sitemap a {color: #fff; white-space: nowrap;}
.sitemap_list {margin: 140px 0 0; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; align-content: flex-start;}
.sitemap_list > li {flex: none; width: auto; margin: 0 84px 100px 0;}
.sitemap_list > li:nth-of-type(6) {margin: 0 0 100px;}
.sitemap_list > li > a {font-size: 25px; font-weight: 800; margin: 0 0 18px; display: block;}
.sitemap_list .sitemap__depth2 li a{font-size: 18px; line-height: 30px; font-weight: 400; position: relative; padding: 0 0 0 16px; box-sizing: border-box; display: block;}
.sitemap_list .sitemap__depth2 li a::before {content : ''; width: 5px; height: 5px; background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.sitemap_list .sitemap__depth3 {margin: 4px 0 16px;}
.sitemap_list .sitemap__depth3 li a{font-size: 15px; line-height: 25px; font-weight: 400; position: relative; padding: 0 0 0 28px; box-sizing: border-box; display: block; opacity: 0.3;}
.sitemap_list .sitemap__depth3 li a::before {content : ''; width: 4px; height: 1px; background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 16px; transform: translateY(-50%);}

@media all and (max-width: 1640px) {
  .sitemap_list {justify-content: flex-start;}
  .sitemap_list > li:nth-of-type(6) {margin: 0 84px 100px 0;}

}
@media all and (max-width: 1024px) {
  #sitemap {z-index: 220;}
  #sitemap .sitemap__cls {top: 20px; right: 20px;}
  #sitemap .container{}
  #sitemap h3 {padding: 30px 0 0; box-sizing: border-box; width: 100%;}
  #sitemap h3 img {max-width: 100%;}
  #sitemap a {}
  .sitemap_list {margin: 40px 0 0; width: 100%; display: block;}
  .sitemap_list > li {width: 100%; margin: 0 0 30px;}
  .sitemap_list > li:nth-of-type(6) {margin: 0 0 30px;}
  .sitemap_list > li > a {font-size: 20px; font-weight: 800; margin: 0 0 12px; display: block;}
  .sitemap_list .sitemap__depth2 li a{font-size: 16px; line-height: 24px; font-weight: 400; position: relative; padding: 0 0 0 16px; box-sizing: border-box; display: block;}
  .sitemap_list .sitemap__depth2 li a::before {content : ''; width: 5px; height: 5px; background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
  .sitemap_list .sitemap__depth3 {margin: 4px 0 10px;}
  .sitemap_list .sitemap__depth3 li a{font-size: 14px; line-height: 25px; font-weight: 400; position: relative; padding: 0 0 0 28px; box-sizing: border-box; display: block; opacity: 0.3;}
  .sitemap_list .sitemap__depth3 li a::before {content : ''; width: 4px; height: 1px; background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 16px; transform: translateY(-50%);}


}

@media all and (max-width: 1024px) {


  .only_chk {display: flex; justify-content: flex-start; align-items: center;}
  .only_chk.flex_center_only_chk {display: flex; justify-content: center; align-items: center;}
  .only_chk input[type=checkbox] {appearance: none !important; width: 0; margin: 0; padding: 0; height: 0; font-size: 0; line-height: 0;}
  .only_chk input[type=checkbox] + label {border-radius: 4px; display: block; width: 18px; height: 18px; background: #fff url(/img/icon/chk_off.png) 50% 50% no-repeat; background-size: 72.22% auto; border: 1px solid #ddd; box-sizing: border-box;}
  .only_chk input[type=checkbox]:checked + label {background: var(--m-color) url(/img/icon/chk_on.png) 50% 50% no-repeat; background-size: 72.22% auto; border-color: var(--m-color); }
  .only_chk.font input[type=checkbox] + label {line-height: 1; margin: 0; font-size: 16px; width: auto; position: relative; padding: 0 0 0 24px; box-sizing: border-box; border: 0; background: transparent;}
  .only_chk.font input[type=checkbox] + label::before {position: absolute; top: 0; left: 0; content: ''; border-radius: 4px; display: block; width: 16px; height: 16px; background: #fff url(/img/icon/chk_off.png) 50% 50% no-repeat; background-size: 72.22% auto; border: 1px solid #ddd; box-sizing: border-box;}
  .only_chk.font input[type=checkbox]:checked + label::before {background: var(--m-color) url(/img/icon/chk_on.png) 50% 50% no-repeat; background-size: 72.22% auto; border-color: var(--m-color);}

}