@charset "UTF-8";


body.global-ja{font-family: 'Ranade', 'Noto Sans JP', 'Spoqa Han Sans Neo', sans-serif;}

/* ## layout */
.full-screen{display: block;width: 100%;height: 100vh;overflow: hidden;}
.scrollbar-track-y{opacity: 0 !important;}

/* #scrollWrap{width: 100%; height: 100%; background-color: #000;}
#scrollWrap #wrapper{width: 100%;height: auto;overflow: hidden;background: #FFFFFF;}
#scrollWrap #wrapper .cont-wrap {min-width: 1400px; } */
#wrapper{width: 100%; height: auto; position: relative;}
/* box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.05);  */
#header{display: block; clear: both; width: 100%; position: fixed; z-index: 10; transition: all 0.3s; height: max(8rem, 4.167vw);}
#contents{position: relative; }
#footer{position:relative; bottom: 0; width: 100%; background-color: #0a0a0a; color: #727273; padding: 0; clear:both; transition: all 0.3s; z-index: 5;}


.fixed #header{box-shadow: 0.4px 0.3px 3px 1px rgba(9, 9, 9, 0.1); background-color: rgba(0,0,0,0.3);}
.fixed #footer{bottom: 0;}
.fixed .bg-gnb{box-shadow: 0px 1px 9.5px 0.5px rgba(9, 9, 9, 0.1);}


.detail-page #header{position: relative;}
.detail-page #contents{margin-top: -3.5rem;}

.container{margin:0 auto;padding:0 10px;max-width:1300px; position:relative; width: 100%;}
.container-sm{margin:0 auto;padding:0 1rem;max-width:1220px; position:relative; width: 100%;}
.container-full{margin:0 auto;padding:0 1rem; position:relative; width: 100%;}
.container-wide{margin:0 auto; padding: 0 1rem; max-width: 1640px; position:relative; width: 100%;}
.section-container{max-width: 1000px; padding: 0; margin: 0 auto;}


#sp-wrapper{width: 100%; margin: 0 auto;}
#sp-header{padding: 20px 0; background-color: #151515;}
#sp-header .container{display: flex; justify-content: space-between; align-items: center;}
#sp-header .btn{color: #fff; border: 1px solid #fff; border-radius: 20px; padding: 9px 23px 7px;}
.sp-bg{background-color: #f5f7fa;}
#sp-footer{padding: 10px; color: #777; margin-top: 30px; text-align: center; font-size: 13px;}

#sp-header .btn-history-back{display: none;}

#sp-wrapper.page-mypage #contents{max-width: 660px; margin: 0 auto;}
#sp-wrapper.page-mypage #sp-content{max-width: 660px; margin: 0 auto;}
/* #sp-wrapper.page-mypage #sp-footer{position: relative;}
#sp-wrapper.page-mypage .btn-back{display: none;}
#sp-wrapper.page-mypage .btn-history-back{display: block;}
#sp-wrapper.page-mypage #sp-header{padding: 40px 0 0 0 }
#sp-wrapper.page-mypage .subwrap-top{padding-top: 30px;}
#sp-wrapper.page-mypage .subwrap-top .container{overflow: visible;}
#sp-wrapper.page-mypage .subwrap-top .subwrap-title{font-size: 40px; color: #1a1a1a; line-height: 1em; font-weight: 500; text-align: center; display: block;} */


.theme-dark{background-color: #08080d;}
.theme-dark .section-header{color: #fff;}
.theme-dark .breadcrumb-item{color: #fff;}
.theme-dark .breadcrumb-item.active a{color: #eee;}

.theme-dark .sub-tab ul li a{background-color: #333; color: #fff;}
.theme-dark .sub-tab ul li a.active{background-color: #fff; color: #0a0a0a; border-color: #fff;}
.theme-dark .sub-tab ul li a.active:hover{color: #777;}


/**********
* ## header
**********/
#header .container{height: 100%;}
#header .header-wrap{display: flex; align-items: center; justify-content: space-between; height: 100%;}
#header .logo{display: inline-block; z-index: 10;}
#header .logo h1{font-size: 0;}
.logo a{display: inline-block; width: 120px; height: 66px; background: url('../images/logo-boolim.png') no-repeat 0 0; background-size: cover; color: #fff; }


.tnb{display: flex; align-items: center;}
.tnb li{position: relative; }
.tnb li:last-child{margin-left: 1rem;}

.header-util{display: flex; align-items: center; z-index: 10;}
.util-widget{margin-right: 2rem; height: 2rem; position: relative; font-family: 'Spoqa Han Sans Neo', sans-serif;}
.util-widget .ico-arrow-large{width: 15px; height: 10px; margin-left: 3px;}

.util-dropdown{position: relative; display: inline-block;}
.util-dropdown a{color: #f0f5fc; display: inline-flex; align-items: center;}
.util-dropdown a .icon{margin-left: 10px; transition: transform .2s ease;}
.util-dropdown.on a .icon{transform: rotate(180deg);}
.user-icon-menu{opacity: 0; position: absolute; top: -172px; left: 0; width: 100px; left: 50%; transform: translate(-50%, 0); transition: opacity .3s ease;}
.util-dropdown.on .user-icon-menu{opacity: 1; top: 100%;}
.user-icon-menu ul{background-color: #fff; display: flex; flex-direction: column; padding: 10px 0; border-radius: 6px; box-shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.16), 0 3px 12px 0 rgba(0, 0, 0, 0.12)}
.user-icon-menu li{padding: 5px 10px;}
.user-icon-menu li a{display: block; color: #888; text-align: center; font-size: 1.4rem;}
.user-icon-menu li a:hover{color: #000;}

.user-icon-menu .pop-arrow{text-align: center; line-height: 1;}
.pop-arrow .ico-arrow{display: inline-block; margin-bottom: -3px;  width: 0px; height: 0px; border-bottom: 7px solid #fff; border-left: 6px solid transparent; border-right: 6px solid transparent;}

.ico-down{background-image: url('../images/icons/ico-down-w.png'); width: 1rem; height: 0.7rem; }

.util-button{position: relative;}
.util-button button{display: inline-block; margin: 0; }
.util-button .icon-bar {background-color: #f0f5fc; width: 22px; height: 2px; display: block; }
.util-button .icon-bar:nth-child(2){margin: 5px 0;}

.util{position: fixed; right: 4vw; width: 100%; bottom: 20%; z-index: 200;}
.util .list{position: absolute; right: 0; top: 0; transform: translateX(0); transition: transform .5s ease-in-out;}
.util .list li{display: block; text-align: center; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
.util .list a{display: flex; align-items: center; justify-content: center;}

.util .list > li .dropdown{ position: absolute; top: 0; left: 0; width: 100%; opacity: 0; visibility: hidden; }
.util .list > li .dropdown.active{ opacity: 1; visibility: visible; height: 106px; top: -106px;}
.util .list > li .dropdown li{position: absolute; bottom: 0; transform: scale(1);}



.subpage #gnb .topmenu{color: #0a0a0a;}
.subpage .util-dropdown a{color: #0a0a0a;}
.subpage .util-button .icon-bar{background-color: #0a0a0a;}
.subpage #header{position: relative;}
.subpage .logo a{background-image: url('../images/logo-boolim-bg.png');}

.subpage .util-dropdown .ico-down{background-image: url('../images/icons/ico-down-b.png'); width: 1rem; height: 0.7rem; }


/**********
* ## gnb
**********/
#gnb{text-align: center; height: 100%; transition: left .5s ease-in-out;}
#gnb .topmenu{display: flex; justify-content: center; align-items: center; height: 100%; color: #f0f5fc;}
#gnb .topmenu > li{position: relative; display: flex; height: 100%; align-items: center;}
#gnb .topmenu > li:before {content: ""; position: absolute; left: 50%; top: 0px; transform: translate(-50%, 0); width: 100%; height: 0px; opacity: 0; background-color: #525966; }
#gnb .topmenu > li > a{display: flex; align-items: center; justify-content: center; position: relative; width: 100%; padding: 0 3rem; font-weight: 500; font-size: clamp(1.6rem, 0.82vw, 2.4rem); white-space: nowrap; transition: padding .3s; height: 100%;}
#gnb .topmenu > li > a::before{content: ""; position: absolute; left: 50%; top: 27%; transform: translate(-50%, -100%); width: 6px; height: 6px; background-color: var(--theme-color); border-radius: 50%; opacity: 0;}
#gnb .topmenu > li.active > a{font-weight: 600;}
#gnb .topmenu > li.active > a::before{opacity: 1;}
/* #gnb .topmenu > li > a:hover{} */
#gnb .topmenu > li > a:after{display:block;content:""; width:100%;height:1px; background:#898989; position:absolute; left:0; top: 100%; transform:scaleX(0);transition:all 0.4s;}
#gnb .topmenu > li:hover>a:after{transform:scaleX(1);} 
/* #gnb .topmenu > li.active>a:after*/
#gnb .topmenu > li:hover:before{opacity: 1;}

#gnb .topmenu > li > .dropdown-menu{position: absolute; width: 100%; height: 240px; bottom: -30px; left: 50%; transform: translate(-50%, 100%); white-space: nowrap; text-align: center; opacity: 0; pointer-events: none;}
#gnb .topmenu > li > .dropdown-menu.active{display: block;}
#gnb .topmenu > li > .dropdown-menu.active{opacity:1;transition:all 0.4s 0.4s;}
#gnb .topmenu > li > .dropdown-menu > li{padding-left: 3rem; text-align: left; line-height: 1.2;}
#gnb .topmenu > li > .dropdown-menu > li + li{margin-top: 15px;}
#gnb .topmenu > li > .dropdown-menu > li > a{position: relative; font-size: clamp(1.4rem, 0.725vw, 1.8rem); display: inline-flex; width: 100%; justify-content: flex-start;}
#gnb .topmenu > li > .dropdown-menu > li > a.font-xs{font-size: 1.2rem;}
#gnb .topmenu > li > .dropdown-menu > li > a:hover span::before{width: 100%;}
#gnb .topmenu > li > .dropdown-menu > li > a.active span:before{width: 100%;}
#gnb .topmenu > li > .dropdown-menu > li span{position: relative;}
#gnb .topmenu > li > .dropdown-menu > li > a span:before {content: ""; position: absolute; left: 0%; bottom: -2px; transform: translate(0%, 100%); width: 0; height: 1px; background-color: #fff; transition: width .3s; }

.bg-gnb{position:absolute; left:0; top:0; background-color: rgba(0, 0, 0, 0.3); opacity: 0; width:100%; height:0; overflow: hidden; z-index: -1; backdrop-filter: blur(25px);}
.bg-gnb:before{display:block; content:""; width:100%; height:1px; background-color:rgba(255,255,255,0.2); position:absolute;left:0; top: max(8rem, 4.167vw);}


#header.open {background-color: transparent; box-shadow: none;}
#header.open .util .list{transform: translateX(-1rem); }
#header.open .topmenu > li > a{padding: 0 4em}
#header.open .topmenu > li.menu-03 > a{padding: 0 5em}
#header.open .bg-gnb{height: 400px; opacity: 1; transition: height 0.3s ease-in-out, opacity 0.2s ease-in-out;}
#header.open .topmenu > li:before{height: 400px;  transition: height  ease-in-out.5s, opacity ease-in-out .5s }
#header.open .topmenu > li .dropdown-menu {opacity: 1;;pointer-events: visible; transition: opacity 0.3s; transition-delay: .1s}
#header.open .topmenu > li > a:before {background-color: #fff}
#header.open .topmenu a svg {fill: #fff}

#header.open .topmenu{color: #fff;}
#header.open .util-dropdown a{color: #f0f5fc;}
#header.open  .ico-down{background-image: url('../images/icons/ico-down-w.png');}
#header.open .user-icon-menu li a{color: #0a0a0a;}
#header.open .util-button .icon-bar{background-color: #f0f5fc;}



/**********
* ## dlpo
**********/
.dlpo-wrap.hide{display: none;}
.dlpo-wrap {-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}
.dlpo-wrap { position:relative;top:0; overflow: hidden; z-index: 20;}
.dlpo-wrap .banner-item{display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; margin: 0 auto; padding: 5px 0; align-items: center; justify-content: center; background-color: #96faa3;}
.dlpo-wrap .banner-item a{position: relative; z-index: 1; text-align: center; font-weight: 300; color: #000;}

.dlpo-wrap .dlpo-close{position: absolute; top: 7px; right: 40px; width: 20px; height: 20px; text-indent: -9999px; cursor: pointer; z-index: 1;}
.dlpo-wrap .dlpo-close:before, .dlpo-wrap .dlpo-close:after{width: 25px; height: 1px; top: 50%; margin-top: -1px; left: -2px; content: ""; background: #fff; transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); position: absolute;}
.dlpo-wrap .dlpo-close:after {transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}
.dlpo-wrap.close { height:0}


/**********
* ## footer
**********/
.footer-info-wrap{display: flex; align-items: flex-start; justify-content: space-between; padding: 6rem 0;}
.footer-widget .tel{color: #f5f7f9; font-size: 3.6rem; font-weight: 700; margin-bottom: 2.6rem;}
.footer-widget.menu{display: flex; }
.footer-widget.other p{color: #f5f7f9;}
.footer-etc{background-color: #323233; padding: 2rem 0; text-align: center;}

.footer-widget.logo a{background-image: url('../images/logo-boolim-footer.png'); height: 60px;}

.footer-widget.menu .item{margin-left: 6rem; font-size: clamp(1.4rem, 0.725vw, 1.8rem);}
.footer-widget.menu .item:first-child{margin-left: 0}
.footer-widget.menu .item .title{color: #ccc; margin-bottom: 2.5rem; line-height: 1;}
.footer-widget.menu .item ul li{padding: 4px 0;}
.footer-widget.menu .item ul li a:hover{color: #999;}

.footer-widget.info .select-box{width: 100%; border-radius: 0; font-size: clamp(1.4rem, 0.725vw, 1.8rem); border: 0;}
.footer-widget.info .select-box .btn-select{background-color: #fff; border-radius: 0; }
.footer-widget.info .select-box .select-list{box-shadow: none; border: 0; top: 1px; padding: 0; border-radius: 0;}
.footer-widget.info .select-box .select-list a{padding-left: 10px; text-align: left;}

.footer-etc p{line-height: 1; font-size: clamp(1.2rem, 0.63vw, 1.6rem);}
.footer-etc p + p{margin-top: 10px;}
.copyright {letter-spacing: -0.5px;} 


.social-link{margin-bottom: 1.5rem;}
.social-link:last-child{margin-bottom: 0;}

.footer-links{display: flex; align-items: center; margin-bottom: 10px;}
.footer-links li a{border: 1px solid #727273; display: inline-block; padding: 6px 14.8px; font-size: 12px;}
.footer-links li:last-child a{color: #fff; margin-left: 10px; border-color: #fff;}

.global-en .footer-etc p{line-height: 1.3;}


/**********
* ## common
**********/

.form-group .label .icon{margin-left: 5px;}
.form-group .form-content{position: relative; display: flex;}
.form-group .form-content .location-input{display: flex; flex: 1;}
.form-group .form-content .location-input .select-box{width: 57%; }
.form-group .form-content .location-input .select-box.sub{margin-left: 3%; width: 40%;}

.form-group .form-content .name-container{margin-right: 20px; width: 40%;}
.form-group .form-content .phone-container{width: 60%;}

.phone-container .select-box{flex: 0 0 31%;}
.phone-container .dx-input{flex: 0 0 31%; margin-left: 3.5%;}


/* ## single page wrap  */
.btn-back{background: url('../images/icons/btn_back_s2.png') no-repeat center left; display: inline-block;}
.btn-back span{margin-left: 30px; display: inline-block;}

.page-mypage .btn-history-back{background: url('../images/icons/btn_back_s2.png') no-repeat center left; display: inline-block;}
.page-mypage .btn-history-back span{margin-left: 30px; display: inline-block;}


.animation-arrow a:hover .icon-btn .arrow { transition: 0.5s; left: 0;}
.animation-arrow a:hover .icon-btn .arrow + .arrow {transition: 0.5s; left: 100%;}
.icon-arrow-wrap{width: 2rem; height: 2rem; background-color: #f2eee9; text-align: center; border-radius: 50%; margin-left: 1rem; position: relative;}
.icon-btn{position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.icon-btn .arrow{width: 2rem; height: 2rem; position: absolute; left: -100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.icon-btn .arrow + .arrow{left: 0;}


/**********
* ## LOGIN
**********/
/* .panel-login .form-group{margin-bottom: 2rem;} */
/* .panel-login .panel-body{padding-top: 3rem;} */
.login-box{border-bottom: 1px solid #d0d0d0; margin-bottom: 3rem; padding-bottom: 3rem;}
.login-box + .login-box{padding-bottom: 1rem;}
.panel-login .form-group{margin-bottom: 1.5rem;}
.input.round{border-radius: 4px; box-shadow: 0.8px 0.6px 9.5px 0.5px rgba(9, 9, 9, 0.05); background-color: #fff; padding-left: 1rem;}

.login-button{margin-top: 2rem;}
.login-button .sp-submit{background-color: #065ab9; width: 100%;}
.login-row .login-label{font-size: 14px; color: #111; }
.login-button .sp-submit.btn-register{background-color: #626262; margin-top: 10px;}
.social-login{position: relative; border-top: 1px solid #eee; background-color: #fff; height: 3rem; width: 100%; display: flex; border-radius: 1.5rem; line-height: 3rem; align-items: center; padding-left: 2rem; color: #000;}
.social-login img{max-width: 30px; max-height: 30px; margin-right: 10px;}
.social-login p{margin-bottom: 1rem;}
.sl-btns a{width: 100%; display: block; border: 1px solid #ddd; padding: 9px 10px 10px 10px; margin-bottom: 10px; position: relative;}
.sl-btns a img{position: absolute; left: 10px; top: 11px;}
.sl-btns a .text{line-height: 1em; margin-left: 28px;}

.login-register{background-color: #f4f4f4; padding: 15px 0; text-align: center;}
.login-register p{margin-bottom: 10px;}
.login-register a{text-decoration: underline;}

.autologinalert{font-size: 12px; margin-top: 1rem;}

.guest-wrap{margin-top: 2rem;}
.guest-wrap h4{font-size: 0.85rem;}
.guest-privacy{border: 1px solid #cdcdcd; text-align: left; line-height: 1.6em; color: #666; background: #fafafa; padding: 10px; height: 150px; margin: 10px 0; overflow-y: auto; font-size: 0.65rem;}
.guest-wrap .btn{margin-top: 1rem;}
.guest-wrap .checkbox-custom label{font-size: 0.65rem; letter-spacing: -1px;}

.guest-order{margin-top: 2rem; border-top: 1px solid #cdcdcd; padding-top: 1rem;}
.guest-order-desc{background: #f2f2f2; padding: 0.5rem; margin-top: 1rem; font-size: 0.65rem;}

.logrin-row .label{font-size: 1.6rem; font-weight: 500; color: #000; line-height: 1; margin-bottom: 1rem; display: block;}


/* ## PASSWORD / FINDACCOUNT */
.panel{width: 100%; max-width: 52rem; padding: 0 10px; margin: 11rem auto 14rem;}
.panel-header{padding: 0 0 2rem; background-color: #fff;}
.panel-header.border{margin-bottom: 2rem; border-bottom: 1px solid #111;}
.panel-header h2{font-size: 3.8rem; font-weight: 600; color: #000;}
.panel-header .desc{font-size: 16px; color: #626262; font-weight: 400; margin-bottom: 10px;}
.panel-body{position: relative; margin: 0 auto; padding: 3rem; background-color: #f0f0f0; border-radius: 12px;}
.panel-body .desc{margin-bottom: 15px; line-height: 1.5;}
.panel-link{margin-top: 1rem; display: flex; align-items: center; justify-content: space-between; color: #666;}
/* .panel-link .check-box label{margin-left: 20px;}
.panel-link .check-box label::before{top: -1px}
.panel-link .check-box input[type="checkbox"]:checked + label::after{top: -1px;} */
.panel-link .links a{position: relative; padding-left: 10px; margin-left: 5px;}
.panel-link .links a::before{content: ''; position: absolute; top: 3px; left: 0; width: 1px; height: 15px; background-color: #626262; margin-right: 5px; }
.panel-link .links a:first-child::before{display: none;}
.panel-footer{position: relative; text-align: center; border-top: 1px solid #eee; background-color: #fff; padding: 1rem 2rem; background-color: #f4f4f4;}

.findaccount .form-table .phone-input{width: 50%;}

.control-label{margin-bottom: 5px; display: inline-block;}
.result-message{padding: 1rem 0; text-align: center;}


.panel.findaccount .form-group{margin-bottom: 2rem;}
.panel.findaccount .login-box{padding-bottom: 0;}

/**********
* ## REGISTER
**********/
/* #sp-wrapper.register{max-width: 640px;} */
.register-section{margin-bottom: 5rem;}
.register-section h4{margin-bottom: 15px; font-size: 18px; color: #111; font-weight: 500;}


.register-section .bs-number-input{width: auto;}

.check-agrea{margin-bottom: 1rem; margin-left: 1rem;}
.check-agrea label{font-weight: 600; color: #000;}
.check-agrea label .req{color: #ff8133; font-size: 12px;}
.check-agrea label .req.sel{color: #888; }4

.check-container + .check-container{border-top: 0; }

.agree-box{color: #626262;}
.agree-box .check-title{font-weight: 600; color: #000; padding-left: 1rem; margin-bottom: 1rem; margin-top: 3rem;}
.agree-box .error-place .error + .error{display: block; margin-left: 0; margin-top: 0;}
.agree-box .check-container strong{margin-right: 5px;}

.agree-box .info-box{border: 1px solid #d0d0d0; margin-top: 1rem; color: #000; padding: 1rem; margin-bottom: 0;}

.panel-body .btn-wrap{margin-top: 2rem;}

.btn-inner{margin-left: 10px; display: inline-block;}

.result-place{font-size: 12px; display: inline-block; margin-left: 1rem;}
.result-place .success{color: #1473e6; background-color: transparent;}
.result-place .fail{color: #ff8133;}
.cert-container{display: none; margin-top: 10px;}

.d-inline-flex{display: inline-flex;}
.d-inline-flex .check-box + .check-box{margin-left: 10px;}
.d-inline-flex .radio-box + .radio-box{margin-left: 10px;}


.register-result .sp-submit{background-color: #1f3666;}
.result-logo{margin: 1rem auto 4rem; text-align: center;}
.result-logo img{width: 53px;}

.result-message .title{font-size: 24px; color: #000; font-weight: 600; margin-bottom: 1rem;}
.result-message .desc{color: #666;}

.pass-modify .form-group{margin-bottom: 1rem;}
.pass-modify .form-btn{margin-top: 2rem;}


/**********
* ## MAIN
**********/
#main{position: relative; }
#main .section{padding: 15rem 0; z-index: 1;}
.section{position: relative;}

.btn-more{width: 10rem; height: 4rem; line-height: 4rem; background-color: #5e5e5e; color: #fff; display: inline-block; text-align: center; }
.full-screen {display: block; width: 100%; height: 100vh; overflow: hidden; }


.section-main-visual{position: relative; overflow: hidden; height: 100vh; background-color: #999; z-index: 1;}
.section-main-visual .screen-swiper{height: 100%;}
.section-main-visual .swiper-slide{ overflow: hidden; position: relative;}
.section-main-visual .screen-image::before{content: ''; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #000; opacity: 0.4;}
.section-main-visual .screen-image {display: inline-block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10; background-position: center; background-size: cover; background-repeat: no-repeat;}
.section-main-visual .vbg-video{z-index: 10 !important;}

.section-main-visual .screen-text-wrap{display: flex; align-items: center; justify-content: center; height: 100%; position: absolute; top: 0; left: 0; width: 100%;}
.section-main-visual .screen-text-continer{position: relative; z-index: 1; display: flex; justify-content: center;}
.section-main-visual .screen-text-continer p{font-size: clamp(4.2rem, 2.8125vw, 7.2rem) ; font-weight: 600; color: #fff; }
.section-main-visual .screen-space{position: relative;  bottom: 0; left: 0; visibility: hidden; transform: scaleX(0); transition: all cubic-bezier(0.075, 0.82, 0.165, 1) 3s ; }
.screen-text-wrap.active .screen-space{transform: scaleX(1); visibility: visible; flex: 1; width: 100%;}
.section-main-visual .screen-line{width: 0; background-color: #fff; height: 1px; transition: all ease 0.5s ; transition-delay: 1s; position: absolute; top: 22%; left: 25%;}
.screen-text-wrap.active .screen-line{width: 45%;}

.global-en .screen-text-wrap.active .screen-line{width: 42%;}
.global-en .section-main-visual .screen-text-continer p{font-size: clamp(2.8rem, 2.5vw, 6.8rem);}

/* .screen-btns{margin-top: 33px; text-align: center; position: relative;}
.section-main-visual .btn{width: 14rem; height: 4rem; line-height: 3.8rem; background-color: #fff; color: #1c1c1c; font-size: 1.8rem; display: inline-block; border: 1px solid #666; padding: 0;  transition: all ease .2s;}
.section-main-visual .btn + .btn{margin-left: 20px;}
.section-main-visual .btn:hover{background-color: #666; color: #fff;} */

.section-main-visual .swiper-pagination{bottom: 2.6rem; left: 0; width: 100%; }
.section-main-visual .swiper-pagination .swiper-pagination-bullet{width: 25px; height: 4px; background-color: #fff; opacity: 0.5; border-radius: 0;}
.section-main-visual .swiper-pagination .swiper-pagination-bullet-active{opacity: 1;}

.section-main-visual .video-box{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.section-main-visual .ytplayer-player {position: absolute;}
.bg-cover .bg{display: none;}

.section-main-visual .slide-video .video-box.loaded .screen-image{opacity: 0;}


.scroll-down{position: relative; bottom: 11rem; text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column; z-index: 2}
.scroll-down .btn-scroll{width: 140px; height: 30px; border-radius: 15px; position: relative; margin-bottom: 5px;}
.scroll-down .btn-scroll::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.2; background-color: #fff; border-radius: 15px;}
.scroll-down .btn-scroll button{width: 140px; height: 30px; line-height: 30px; color: #fff; border-radius: 15px; position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%, -50%); z-index: 999;}
.scroll-down span{width: 5px; height: 5px; background-color: #d0d0d0; border-radius: 5px; display: inline-block; margin-top: 10px;}

.btn-arrow-wrap{position: absolute; width: 100%; top: 50%; margin-top: -25px; ;}
.btn-arrow-wrap button{background-position: center; background-size: cover; width: 50px; height: 50px; position: absolute; z-index: 1;}
.btn-arrow-wrap .screen-prev{background-image: url('../images/icons/ico_slide_lt_dft.png'); left: -100px;}
.btn-arrow-wrap .screen-next{background-image: url('../images/icons/ico_slide_rt_dft.png'); right: -100px;}

.btn-arrow-wrap .screen-prev:hover{background-image: url('../images/icons/ico_slide_lt_act.png');}
.btn-arrow-wrap .screen-next:hover{background-image: url('../images/icons/ico_slide_rt_act.png');}

/* .pagination{position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.pagination li{position: relative; }
.pagination li a{display: inline-block; margin: 0 8px;} */


.section-header{position: relative;}
.section-header-title{font-size: 4.8rem; margin-bottom: 0.8rem; font-weight: 600; }
.section-header-desc{font-size: 14px; color: #727273;}
.section-header-line{width: 60px; margin: 0 auto 0.8rem; height: 1px; background-color: #065ab9;}
.section-header-arrow button{width: 22px; height: 18px; background-size: 22px 18px; display: inline-block; background-repeat: no-repeat;}

.section-header.text-white .section-header-title,
.section-header.text-white .section-header-desc{color: #fff;}
#main .section-header .section-header-title{font-size: clamp(3.2rem, 2.813vw, 7.2rem) ; margin-bottom: 0;}
#main .section-header .section-header-desc{margin-bottom: 2.5rem; font-size: clamp(1.6rem, 0.9375vw, 2.4rem); line-height: 1; font-weight: 700;}

.swiper-arrows{position: absolute; top: 50%; z-index: 1; width: 100%;}
.swiper-arrows button{width: 60px; height: 60px; background-size: cover; display: inline-block; background-repeat: no-repeat; position: absolute;}
.swiper-arrows .btn-swiper-prev{left: 5rem; margin-top: -30px; background-image: url('../images/icons/btn-main-pre-d.png'); }
.swiper-arrows .btn-swiper-next{right: 5rem; margin-top: -30px; background-image: url('../images/icons/btn-main-next-d.png');}
.swiper-arrows .btn-swiper-prev:hover{background-image: url('../images/icons/btn-main-pre-h.png'); }
.swiper-arrows .btn-swiper-next:hover{background-image: url('../images/icons/btn-main-next-h.png'); }


#section-01 {background-color:#fff;}
#section-01 .section-wrap{position: relative; }
#section-01 .section-wrap .section-header{text-align: center;}
#section-01 .section-wrap .section-content{margin-top: 6rem;}

.business-wrap {display: flex; flex-direction: column; height: max(52rem, 35.938vw);}
.business-wrap .bg{position: absolute; width: 100%; height: 100%;}
.business-wrap .bg img{position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; }

.business-wrap .item{opacity: 0; transition: opacity 500ms ease 300ms; }
.business-wrap .item.active{opacity: 1; z-index: 2; }
.business-wrap .cont{position: absolute; top: 50%; left: max(3rem, 3.125vw); color: #fff; font-size: clamp(1.6rem, 0.9375vw, 2.4rem); transform: translate(0, -50%); z-index: 2;}
.business-wrap .cont .grid-title{font-size: clamp(2.4rem, 1.6667vw, 4rem); font-weight: 600; transition-delay: 0.2s;}
.business-wrap .cont .grid-desc{margin: 3.5rem 0; color: #f5f5f5; transition-delay: 0.4s;}
.business-wrap .cont a{transition-delay: 0.6s; display: block;}

.business-wrap .item.active [data-animate]{opacity: 1; transform: none;}

.business-category{display: flex; align-items: center; justify-content: center; flex-direction: column; position: absolute; top: 0; right: 0; bottom: 0; z-index: 2;}
.business-category ul{display: flex; flex-direction: column; height: 100%; align-items: flex-end;}
.business-category li{transition: transform 350ms, opacity 350ms; will-change: transform; flex: 1; height: 100%; }
.business-category li.active{background-color: #001e40; opacity: 1;}
.business-category li.active .box{width: max(36rem, 20.834vw);}
.business-category li.active .box h4{font-size: clamp(2.4rem, 1.6667vw, 4rem);}
.business-category li.active .box h4 .icon{display: block;}
.business-category li .box{width: max(32rem, 18.75vw); display: flex; flex-direction: column; justify-content: center; height: 100%; padding-left: 3rem; position: relative; cursor: pointer; transition: width 500ms ease; }
.business-category li .box::before{background-color: #143d66; opacity: 0.3; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: opacity 0.3s ease;}
.business-category li .box h4{color: #fff; font-size: 2.4rem; z-index: 1; transition: font-size ease .3s;}
.business-category li .box h4 a{display: flex; align-items: center; z-index: 1; position: relative;}
.business-category li .box h4 .icon{display: none}
.business-category li .box p{color: #f5f5f5; margin-top: 1rem; z-index: 1;}
.business-category li .box:hover::before{opacity: 0.6;}

[data-animate] {opacity: 0; transition: all 0.8s ease-out; }
[data-animate="bottom"] {transform: translate3d(0, 30px, 0); }

.icon-more{width: 3rem; height: 3rem; background-color: #fff; text-align: center; border-radius: 50%; margin-left: 10px; position: relative;}
.icon-btn{position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.icon-btn .arrow{width: 3rem; height: 3rem; position: absolute; left: -100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.icon-btn .arrow + .arrow{left: 0;}
.business-category li .box h4:hover .icon-btn .arrow { transition: 0.5s; left: 0;}
.business-category li .box h4:hover .icon-btn .arrow + .arrow {transition: 0.5s; left: 100%;}
.icon-more .icon-arrow{width: 14px; height: 12px; background-image: url('../images/icons/ico-arw-more.png'); }


#main #section-02{overflow: hidden; width: 100%; position: relative;  padding: 0;}
#section-02 .section-header{position: absolute; top: 14.85rem; z-index: 2;}
.brand-wrap .brand-card {position: absolute; left: 0; top: 0; width: 50%; height: 100vh; }
.brand-wrap .container-header{position: absolute; left: 100%; top: 0; max-width: 85.416vw; width: 100vw; -webkit-transform: translateX(-50%) rotate(0.001deg); -ms-transform: translateX(-50%) rotate(0.001deg); transform: translateX(-50%) rotate(0.001deg); height: 30%; z-index: 2; padding: 0 10px;}
.brand-wrap .brand-card.fixed {position: fixed; left: 0; bottom: 0; }
.brand-wrap .brand-card.fixed .card {opacity: 0; visibility: hidden; }
.brand-wrap .brand-card.fixed .card.active {opacity: 1; visibility: visible; }
/* .brand-wrap .brand-card.fixed .cont .container .inner{margin-top: 0;} */
.brand-wrap .brand-card.fired {position: absolute; left: 0; bottom: 0; height: auto; }
.brand-wrap .brand-card.fired .card:last-child {opacity: 1; visibility: visible; }
.brand-wrap .brand-card .card {position: absolute; left: 0; bottom: 0; width: 100%; height: 100vh; -webkit-transition: .3s; transition: .3s; }
.brand-wrap .brand-card .card.first {z-index: 1;}
.brand-wrap .brand-card .cont {position: relative; width: 100%; height: 100%;}
.brand-wrap .brand-card .cont .container {position: absolute; left: 100%; top: 0; max-width: 85.416vw; width: 100vw; -webkit-transform: translateX(-50%) rotate(0.001deg); -ms-transform: translateX(-50%) rotate(0.001deg); transform: translateX(-50%) rotate(0.001deg); display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.brand-wrap .brand-card .cont .container .inner {background-color: #fff; padding: max(3rem, 3.125vw); border-radius: 6px; color: #0a0a0a; width: 100%; width: 33.334vw; top: 9rem; height: 25vw; position: relative;}
.brand-wrap .brand-card .cont .brand-logo {margin-bottom: max(3rem, 3.125vw); text-align: center;}
.brand-wrap .brand-card .cont .brand-logo img{max-width: 100%; width: auto;}
.brand-wrap .brand-card .cont .line {width: 40px; height: 2px; background-color: #0a0a0a;}
.brand-wrap .brand-card .cont h4 {font-weight: 600; font-size: 2.4rem; line-height: 1em; margin: 2rem 0 3rem;}
.brand-wrap .brand-card .cont .desc {font-size: clamp(1.6rem, 0.9375vw, 2.4rem); display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 4; font-family: 'Spoqa Han Sans Neo', sans-serif;}
.brand-wrap .brand-card .cont .desc em{display: inline-block; text-decoration: underline; }
.brand-wrap .brand-card .cont .btn {display: inline-block; font-weight: 500; font-size: clamp(1.6rem, 0.9375vw, 2.4rem); margin-top: 3rem; padding: 0; border: 0;}

.brand-wrap .brand-card .cont.manitsuit {background-color: #08080d; }
.brand-wrap .brand-card .cont.lemast {background-color: #26282c; }
.brand-wrap .brand-card .cont.lemast .brand-logo img{max-width: 50%; padding: 1.7453rem 0;}
.brand-wrap .brand-card .cont.takaoka {background-color: #0c1330; }
.brand-wrap .brand-card .cont.zen {background-color: #004786; }

.brand-wrap .brand-view .vis {width: 50%; height: 100vh; margin-left: 50%; background-repeat: no-repeat; background-position: center; background-size: cover; }
.brand-wrap .brand-mobile {display: none; }


.global-ja .brand-wrap .brand-card .cont .container .inner{height: auto; padding: 4rem;}
.global-ja .brand-wrap .brand-card .cont .desc{-webkit-line-clamp: 6;}
.global-ja .brand-wrap .brand-card .cont .brand-logo{margin-bottom: 3rem;}

.global-en .brand-wrap .brand-card .cont .container .inner{height: auto; padding: 4rem;}
.global-en .brand-wrap .brand-card .cont .desc{-webkit-line-clamp: 6;}


#main #section-03{background: #fff; padding: 0; z-index: 0;}
.support-wrap{display: flex;}
.support-wrap .notice-container{flex-grow: 1; width: 69.13%; padding: 15rem 7.5rem 15rem 0; position: relative;}
.support-wrap .card-container{flex-shrink: 0; width: 30.87%; padding: 15rem 0 15rem 7.5rem; position: relative;}
.bg-card{position: fixed; top: 0; right: 0; width: 30%; height: 100%; background-color: #f5f5f5; z-index: 0;}
.notice-container .support-swiper{ margin-top: max(3rem, 3.125vw);}
.notice-container .grid-item .image{margin-bottom: 2rem; overflow: hidden; /* height: 32rem;  */}
.notice-container .grid-item .image img{width: 100%; object-fit: cover; height: 100%;}
.notice-container .grid-item .cont .title{font-weight: 600; font-size: clamp(1.8rem, 1.25vw, 3.2rem); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: 1.9rem 0 1.2rem; line-height: 1;}
.notice-container .grid-item .cont p{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }

.notice-container .swiper-nav{position: absolute; right: 0; width: 82px; height: 36px; bottom: 14px;}
.notice-container .swiper-nav .swiper-button-prev{left: 0; background-image: url('../images/icons/btn-news-pre-d.png');}
.notice-container .swiper-nav .swiper-button-next{right: 0; background-image: url('../images/icons/btn-news-next-d.png');}
.notice-container .swiper-nav .swiper-button-prev:hover{background-image: url('../images/icons/btn-news-pre-h.png');}
.notice-container .swiper-nav .swiper-button-next:hover{background-image: url('../images/icons/btn-news-next-h.png');}
.notice-container .swiper-nav div{width: 36px; height: 36px;}
.notice-container .swiper-pagination{position: relative; bottom: 0; margin-top: max(3rem, 3.125vw);}
.notice-container .swiper-pagination .swiper-pagination-bullet{width: 25px; height: 4px; background-color: #727273; border-radius: 0;}
.notice-container .swiper-pagination .swiper-pagination-bullet-active{background-color: #1c4268;}


.card-container::before{content: ''; position: absolute; top: 0; left: 0; background-color: #f5f5f5; width: 100%; height: 100%;}
.card-container .item{color: #fff; background-color: #001e40; padding: 3rem; background: url('../images/main/m-mrecruitment-bg.png') no-repeat center/cover;  height: max(35rem, 21.98vw);}
.card-container .item.qna{background-image: url('../images/main/m-qna-bg.png');}
.card-container .item .inner{position: absolute; bottom: 3rem;}
.card-container .item h5{font-size: clamp(2.4rem, 1.6667vw, 4rem);}
.card-container .item p{margin: 2.6rem 0; font-size: clamp(1.4rem, 0.8334vw, 2.4rem);}
.card-container .item a{background-color: #fff; border-radius: 18px; color: #0a0a0a; padding: 0; height: 35px; width: 110px; line-height: 33px; font-size: clamp(1.4rem, 0.8334vw, 2.4rem)}
.card-container .item.qna{background-color: #ff8d24;}
.card-container .item + .item{margin-top: 3rem;}

.card-container .item .icon{position: absolute; right: 3rem}

.ico-qna{background-image: url('../images/main/m-qna-ico.png'); width: 215px; height: 88px;}
.ico-career{background-image: url('../images/main/m-mrecruitment-ico.png'); width: 109px; height: 146.5px;}


.global-en .card-container .item .inner{left: 3rem; right: 3rem;}

/**********
* ## SUB
**********/
.tmp-image-wrap{margin: 0 auto; position: relative;}
.tmp-image-wrap img{width: 100%;}
.sub{position: relative;}
/* .sub section:last-child{margin-bottom: 5rem;} */
.sub section.bg-section{margin-bottom: 0; background-color: #f5f7f9; }
.sub section.bg-section-f5{margin-bottom: 0; background-color: #f5f5f5; }
.sub section.bg-section-f9{margin-bottom: 0; background-color: #f9f9f9; }
.sub section.section-product{margin-bottom: 0;}
.section-page{position: relative; padding: max(8rem, 7.8125vw) 0;} /* max(8rem, 7.29165vw) 0 */
.section-page.first{padding-top: 10rem;}
.section-page.last{border-top: 1px solid #ccc; padding-bottom: max(12rem, 10.3925vw);}
.section-page:last-child{padding-bottom: max(12rem, 10.3925vw);}
.sub-tab-wrap + .section-page{padding-top: 0;}
.section-title{font-size: clamp(2.8rem, 2.8125vw, 7.2rem); line-height: 1.38; font-weight: 600;}
.section-desc{position: relative; font-size: clamp(1.6rem, 0.9375vw, 2.4rem); color: #727273;}
.bg-desc{background-color: #f0f0f0; padding: 2rem 1rem; margin-bottom: 2rem;}
.section-image{margin-top: 60px;}
.section-title-wrap{text-align: center;}
.page-title{font-size: 1.2rem; color: #232323; font-weight: 600; line-height: 1;}
.section-content{position: relative;}

.sub .section-header{margin-bottom: 5.5rem;}
.section-header .section-desc{margin-top: 0.4rem;}
.section-header h4{font-size: clamp(3.2rem, 2.0834vw, 5.2rem);}
.section-header h5{font-size: clamp(1.8rem, 1.25vw, 3.2rem); color: #0a0a0a; font-weight: 400; margin-top: 1.6rem;}
.section-header .etc-desc{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); color: #727273; margin-top: 2.5rem;}

.basic-section.section-page{padding-top: 6rem;}
.basic-section .section-header .section-desc{font-size: clamp(1.8rem, 1.25vw, 3.2rem); margin-top: 0; color: #0a0a0a;}

.sub-tab-wrap + .basic-section.section-page{padding-top: 0;}

.sub-visual[data-type=pin] + .sub-tab-wrap{margin-top: max(6rem, 7.8125vw);}/* 15rem */
.sub-visual[data-type=scale] + .sub-tab-wrap{margin-top: max(6rem, 7.8125vw);}/* 15rem */
.sub-visual[data-type=pin] + .sub-tab-wrap.sticky{margin-top: 0;}
.sub-visual[data-type=scale] + .sub-tab-wrap.sticky{margin-top: 0;}


/**********
* #### SUB TOP
**********/
.sub-top-visual {position: relative; width: 100%; background-color: #999;  overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center; }
.sub-top-visual .visual-title {font-size: 2.9rem; color: #fff;  position: relative; line-height: 1.3; display: inline-block; font-weight: 600;}
.sub-top-visual .line{width: 40px; height: 2px; background-color: #fff; margin: 20px 0 18px;}
.sub-top-visual .visual-desc {font-size:1.2rem; color: #000; margin-top: 0;}

.sub-top-wrap{display: flex; flex-direction: column; height: 480px; }
.sub-top-content{display: flex; flex-direction: column; margin-top: 3.5rem; justify-content: center; height: 100%; position: relative;}

.sub-top-visual.company {background-image: url('../images/company/02-title.jpg');}
.sub-top-visual.brand {height: 100vh; background-image: url('../images/brand/rolling-bg.jpg'); display: flex; flex-direction: column; align-items: center; justify-content: flex-end;}
.sub-top-visual.support {background-image: url('../images/support/board-top-img.jpg');}

.sub-top-visual.products-list {background-image: url('../images/products/04-bg.jpg');}
.sub-top-visual.products-list .visual-title{color: #000;}

.sub-top-visual.product-deebot-detail{background-image: url('../images/products/04-detail-top.jpg');}
.sub-top-visual.mypage {background-image: url('../images/member/my-top-img.jpg');}


/**********
* #### SUB TAB
**********/
.sub-tab-wrap{margin: max(6rem, 5.2vw) 0;}
.sub-tab.white{background-color: #f0f0f0;}
.sub-tab-wrap.sticky{position: fixed; width: 100%; left: 0; right: 0; z-index: 11; top: 0; margin: 0; box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.05); background-color: #fff;}
/* .sub-tab.sticky{position: fixed; top: 0; width: 100%; z-index: 10; } */
.sub-tab-wrap.sticky .sub-tab ul li a{border: 0;}


.sub-tab {position: relative;}
/* .sub-tab.full ul{max-width: 100%; flex-wrap: wrap;}
.sub-tab.full ul li{flex: 0 0 33.3333%; margin-top: -1px;} */
.sub-tab ul {display:flex; width:100%; justify-content: center; }
.sub-tab ul li {flex: 1; margin-left: -1px;}
.sub-tab ul li a {display: block; text-align: center; height: max(4rem, 2.813vw); line-height: max(4rem, 2.813vw); letter-spacing: 0; border: 1px solid #c0c0c0; font-size: clamp(1.4rem, 0.83334vw, 2.4rem) ; background-color: #fff;  color: #c0c0c0;}
.sub-tab ul li a:hover{color: #888;}
.sub-tab ul li a.active{background-color: #187EF2; color: #fff;}
.sub-tab ul li a.active:hover{color:#fff}

/**********
* #### SUB TOP NAV
**********/
.sub-tab-nav-warp{position:relative; margin-top: 30px;}
.sub-tab-nav-warp .btn-lnb{display: none;}
.fixed-nav .sub-tab-nav-warp{position:fixed; width: 100%; top: 0; z-index: 2; background-color: #f7f7f7;}
.fixed-nav .sub-tab-nav{margin-bottom: 0;}
.fixed-nav #header{display: none;}

.sub-tab-nav {font-size:0;clear: both;/* display: none; */ margin: 0 auto 3rem; text-align: center; display: flex;}
.sub-tab-nav li { display:inline-block; position: relative; flex: 1; border-bottom: 2px solid #ddd;}
.sub-tab-nav li:last-child {margin-right:0}
.sub-tab-nav li a {display:block;padding: 17px 0 16px;font-size:18px; color: #666;-webkit-transition: color 0.3s;transition: color 0.3s; line-height: 1;}
.sub-tab-nav li.active a,
.sub-tab-nav li a:hover{ color: #111; font-weight: 500;}
/* .sub-tab-nav li a:after {content: '';display: block; height: 2px;width: 100%; background: #121212;position: absolute;bottom: 0;left: 0;opacity: 0;transition: opacity .3s; ;} */
.sub-tab-nav li.active{border-bottom-color: #111; border-bottom-width: 3px;}
/* .sub-tab-nav li.active a:after { opacity: 1; } */


/**********
* #### SUB LNB
**********/
.lnb-wrap{position:relative; background:#fff; bottom: 0; width: 100%; display: flex; padding: 0 3rem; align-items: center; margin-top: auto;}
.lnb-wrap h2{font-size: 1.2rem; font-weight: 600;}
.lnb-wrap.fixed-layer{position:fixed; background:#fff; top: 0; width: 100%; z-index: 10; border-bottom: 1px solid #ddd;}
.lnb-wrap .lnb-menu{height: 5rem; display: flex; align-items: center; border-bottom: 1px solid #d0d0d0; width: 100%;}
.lnb-wrap .lnb-menu .ic{display: inline-block; margin-left: 10px; width: 2px; height: 20px; background-color: #000;}
.lnb-wrap .lnb-menu ul{display: flex; align-items: center; margin-left: 3rem;}
.lnb-wrap .lnb-menu li{position:relative; margin-right: 3rem; font-size: 0.9rem; color: #666;}
.lnb-wrap .lnb-menu li a{color: #666;}
.lnb-wrap .lnb-menu li a.active{color: #000; font-weight: 500; border-bottom: 1px solid #000;}
.lnb-wrap .lnb-menu li a:hover{color: #000; font-weight: 500;}


.breadcrumb{position: relative; display: flex; margin-bottom: 2.5rem;}
.breadcrumb-item{margin-left: 5px; font-weight: 500;}
.breadcrumb-item:first-child{margin-left: 0; }
.breadcrumb-item a{padding-right: 5px;}
.breadcrumb-item.active a{color: var(--theme-color);}
.breadcrumb-item a.home{}


/**********
* #### SUB TOP ETC
**********/
.subwrap-top{text-align:center; background-position: top center; position: relative; margin: 8rem 0 0;}
.subwrap-top.pc { overflow: hidden}
/* .subwrap-top .container { position:relative; overflow:hidden; text-align: left;} */
.subwrap-top .subwrap-title{font-size:4.8rem; position: relative; font-weight: 600; color: #2e3033; line-height: 1.1;}

.subwrap-top.bg-top{background-color: #f0f0f0; margin-bottom: 2rem;}

.subwrap-top .arrow-prev { position:absolute; top:30px; left:15px;}
.subwrap-top .arrow-prev span { color:#777; text-align:left; padding-left:10px; vertical-align:middle}
.subwrap-top .arrow-prev img { vertical-align:middle; width:30px;}
.subwrap-top .arrow-next { position:absolute; top:30px; right:15px;}
.subwrap-top .arrow-next span { color:#777; text-align:right; padding-right:10px;vertical-align:middle}
.subwrap-top .arrow-next img { vertical-align:middle; width:30px;}

.subwrap-top .subwrap-title + a { position:absolute; bottom:0; right:10px;}
.subwrap-title-s{font-size: 42px; color: #121212; font-weight: 700; line-height: 1.3em;}



.wh-wrap{padding: 2rem 4rem 5rem; background-color: #fff;}
.wh-wrap .subwrap-top{padding-top: 0;}



.gallery img{width: 100%;}
.gallery-top{position: relative;}
.thumb-swiper{margin-top: 3rem;}
/* .thumb-swiper .swiper-slide{opacity: 0.8;} */
.thumb-swiper .swiper-slide{cursor: pointer; display: block; }
.thumb-swiper .swiper-slide::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); transition: background-color ease-in-out .2s;}
/* .thumb-swiper .swiper-slide:hover{opacity: 1;} */
.thumb-swiper .swiper-slide:hover::before{background: rgba(0, 0, 0, .2) url('../images/icons/ico-zoom.png') no-repeat center; background-size: 35px; }
.thumb-swiper .swiper-slide-thumb-active {opacity: 1;}
.thumb-swiper .swiper-slide-thumb-active::before{background-color: rgba(0, 0, 0, 0);}
.thumb-swiper .swiper-slide-thumb-active:hover::before{display: none;}

.general-swiper .thumb-list.grid-list{margin-top: 1rem; margin-left: -2rem; margin-right: -2rem;}
.general-swiper .thumb-list .grid-item{flex: 0 0 25%; padding: 2rem;}
.general-swiper .thumb-list .grid-item a{display: block; height: 29rem; position: relative;}
.general-swiper .thumb-list .grid-item a::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.1); transition: background-color ease-in-out .2s;}
.general-swiper .thumb-list .grid-item img{height: 100%; object-fit: cover;}
.general-swiper .thumb-list .grid-item a:hover::before{background: rgba(0, 0, 0, 0) url('../images/icons/ico-zoom.png') no-repeat center; background-size: 35px; }


/**********
* ## ABOUT
**********/
.overview-wrap{display: flex; }
.overview-wrap .image{flex-shrink: 0;}
.overview-wrap .cont{color: #323233; flex-grow: 1; margin-right: 3rem;}
/* .overview-wrap .cont p{font-size: clamp(1.8rem, 1.0417vw, 3.2rem); line-height: 1.56;} */
.overview-wrap .cont p{font-size: clamp(1.8rem, 1.25vw, 3.2rem); line-height: 1.56;}
.overview-wrap .cont p + p{margin-top: 1.5rem;}
.overview-wrap .cont .sign-wrap{text-align: right; margin-top: auto; }
.overview-wrap .cont .sign-wrap p{font-size: 1.8rem; display: flex; align-items: center; justify-content: flex-end;}
.overview-wrap .cont .sign-wrap .name{font-size: 2.4rem; display: inline-block; margin: 0 3rem; letter-spacing: 2px;}
.overview-wrap .cont .sign-wrap .sign{width: 150px; height: 44px; background-color: #eee;}

.global-ja .overview-wrap .cont{width: 62%;}
.global-ja .overview-wrap .cont p{font-size: clamp(1.8rem, 1.198vw, 3.2rem); }
.global-ja .overview-wrap .image{width: 35%;}


.gols-wrap{display: flex; }
.gols-wrap .image{flex-shrink: 0;}
.gols-wrap .cont{margin-right: auto; color: #323233; display: flex; flex-direction: column; flex-grow: 1;}
.gols-wrap .cont p{font-size: clamp(1.8rem, 1.4584vw, 3.2rem) ; line-height: 1.56;}
.gols-wrap .cont p strong{color: #143d66;}
.gols-wrap .cont p + p{margin-top: 1.5rem;}
.gols-wrap .cont .highlight{color: #fff; background-color: #143d66; padding: 1px 8px; font-weight: 400;}

.section-header.gols-title{text-align: center;}
.gols-title .section-desc{background-color: #fff; color: #001e40; font-size: 3.2rem; line-height: 1; width: 15rem; height: 5rem; line-height: 5rem; text-align: center; display: inline-block; margin-top: 4rem;}

.gols-title-wrap{position: relative; margin-top: 12rem;}
.round-top .inner{height: 12.5vw;}
.round-top{margin: 0 auto;}
.round-top span{display: inline-block; border-radius: 50%; width: calc(12.5vw - 60px); height: calc(12.5vw - 60px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url('../images/company/pattern-01-v3.png') repeat center;}
.round-top span:first-child{background-color: #187ef2; z-index: 3; color: #fff; font-size: 3.2rem; font-weight: 500; display: flex; align-items: center; justify-content: center; background-image: none;}
.round-top span:nth-child(2){background-color: #b0d5ff; width: calc(12.5vw - 30px); height: calc(12.5vw - 30px); z-index: 2;}
.round-top span:nth-child(3){background-color: #e5f1ff; width: 12.5vw; height: 12.5vw; z-index: 1; }
.round-top::before{content: ''; top: 50%; left: 0; width: 100%; height: 1px; background-color: #187ef2; position: absolute; }


.global-en .gols-title .section-desc{width: auto; padding: 0 1.5rem;}
.global-en .round-top span{width: calc(50% - 60px); height: calc(10.5vw - 60px); padding: 2rem 6rem; border-radius: 2rem; text-align: center;}
.global-en .round-top span:nth-child(2){background-color: #b0d5ff; width: calc(50% - 30px); height: calc(10.5vw - 30px); z-index: 2;}
.global-en .round-top span:nth-child(3){background-color: #e5f1ff; width: 50%; height: 10.5vw; z-index: 1; }

/* .gols-arrow{margin-top: 4rem; text-align: center;}
.gols-arrow span{display: inline-block; }
.gols-arrow span img{width: 50%;} */

.gols-cont-wrap{margin-top: 8rem; position: relative;}
.gols-cont-wrap::before{content: ''; top: 50%; left: 0; width: 100%; height: 1px; background-color: #143d66; position: absolute;  animation: aniFadeIn 3s;}
.gols-cont-wrap .border{display: flex; align-items: center; justify-content: space-between; position: relative; border-radius: 11rem; padding: 2rem; border: 1px solid #143d66; max-width: 64.063%; margin: 0 auto; background-color: #fff; animation: aniFadeIn 2s;}
.gols-cont-wrap .circle{position: relative;}
.gols-cont-wrap .circle .inner{width: 9.375vw; height: 9.375vw;  border: 1px dashed #143d66; border-radius: 50%;}
.gols-cont-wrap .circle span{width: calc(9.375vw - 2rem); height: calc(9.375vw - 2rem); font-size: clamp(1.4rem, 0.9375vw, 2.4rem); border-radius: 50%; background-color: #143d66; color: #fff;   display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; padding-top: .5rem; line-height: 1.3;} 

.global-ko .gols-cont-wrap .circle .inner{width: 9.375vw; height: 9.375vw;}
.global-ko .gols-cont-wrap .circle span{width: calc(9.375vw - 2rem); height: calc(9.375vw - 2rem); font-size: 2.4rem;}


.ph-wrap ul{}
.ph-wrap ul li{display: flex; margin-bottom: 6rem; align-items: center;}
.ph-wrap ul li .title{width: 9.375vw; height: 9.375vw; flex-shrink: 0; border-radius: 50%; padding: 1rem; background-color: #d9ecff;}
.ph-wrap ul li .title span{color: #fff; background-color: #143d66; display: inline-block; border-radius: 50%; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 2.4rem;}
.ph-wrap ul li .cont{margin-left: 4rem; font-size: 1.8rem; }
.ph-wrap ul li:last-child{margin-bottom: 0;}

.global-en .ph-wrap ul li .cont h5{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); margin-bottom: 0.8rem;}

.campaign-wrap .title{text-align: center;}
.campaign-wrap .title h4{font-size: clamp(2.4rem, 1.6667vw, 4rem) ; width: max(27rem, 14vw); height: max(5rem, 2.25vw); line-height: max(5rem, 2.25vw); color: #fff; background-color: #143d66; display: inline-block;}

.campaign-wrap ul{margin: 6rem auto 15rem; display: flex; justify-content: space-evenly; position: relative;}
.campaign-wrap ul li{color: #143d66;}
.campaign-wrap ul .line{width: 100%; height: 1px; background-color: #143d66; position: absolute; top: 3.646vw; left: 0; }
.campaign-wrap ul li .circle{border-radius: 50%; border: 2px solid #143d66; width: 7.292vw; height: 7.292vw; font-weight: 500; font-size: clamp(1.8rem, 1.8vw, 2.4rem); display: flex; align-items: center; justify-content: center; background-color: #fff; z-index: 1; position: relative; margin: 0 auto;}
.campaign-wrap ul li p{text-align: center; margin-top: 2rem; font-size: 1.8rem; }
.campaign-wrap .box-desc{margin-top: 6rem; border: 1px solid #001e40; padding: 2rem 0; background-color: #fff;}
.campaign-wrap .box-desc p{font-size: 1.8rem; color: #143d66; text-align: center;}


.global-en .campaign-wrap ul li .circle{font-size: clamp(1.6rem, 1.04167vw, 2.4rem);}
.global-en .campaign-wrap ul li{flex: 1;}

.org-cont{margin-top: 15rem}
.org-title{margin-bottom: 10rem;}
.org-title h4{color: #143d66; font-size: clamp(1.8rem, 1.25vw, 3.2rem); line-height: 1.2;}
.org-container {position: relative;}
.org-wrap .depth{position: relative;}
.org-wrap .depth1 {display: flex; justify-content: center; padding-bottom: 7.5rem}
.org-wrap .depth1 .line {position: absolute; width: 1px; height: 100%; background-color: #727273; margin-left: -1px;}
.org-wrap .depth1 .line:before {content: ""; display: block; position: absolute; width: 3px; height: 100%; left: -1px; bottom: -1px ;background-color: #fff; transition: all 0.5s; transition-delay: .5s}

.org-wrap .depth2 {display: flex; padding-top: 7.5rem; align-items: flex-start; width: 100%; }
.org-wrap .depth3 {display: flex; padding-top: 7.5rem; align-items: flex-start; width: 100%; justify-content: space-between;}

.org-wrap.boolim .depth2{padding-right: 3.385vw; padding-left: 3.385vw; justify-content: space-between;}
.org-wrap.boolim .box{flex: 0;}
.org-wrap.boolim .box + .box{margin-left: 0;}
.org-wrap.boolim .depth-line{width: calc(100% - 6.77vw);}
.org-wrap.boolim .depth-line .line.full{width: calc(100% - 30rem); margin-left: 15rem;}

/* .org-container .chairman.left {position: absolute; display: flex; align-items: center; right: 50%;top: 16em;}
.org-container .chairman.left .badge {transition-delay: .85s}
.org-container .chairman.left .line {position: relative; width: 28em;height: 1px; background-color: #E0E0E0}
.org-container .chairman.left .line:before {content: ""; display: block; position: absolute; width: 105%; height: 4px; left: -1px; bottom: -1px ;background-color: #fff; transition: all 0.5s; transition-delay: .55s}

.org-container .chairman.right {position: absolute; display: flex; justify-content: flex-end; width: 50%; left: 50%;top: 21em;}
.org-container .chairman.right .line {position: absolute; top: 50%; left:0; transform: translateY(-50%);width: 80%; height: 1px; background-color: #E0E0E0}
.org-container .chairman.right .line:before {content: ""; display: block; position: absolute; width: 105%; height: 4px; right: -1px; bottom: -1px ;background-color: #fff; transition: all 0.5s; transition-delay: .6s}
.org-container .chairman.right .badge {transition-delay: .95s}
.org-container .chairman.right .box {display: flex; justify-content: center; width: 66.72%; flex-shrink: 0} */

.org-item {overflow: hidden; position: relative; z-index: 2 ; border: 1px solid #727273; border-radius: 1.2em;  opacity: 0; transform: translateY(50px); transition: transform 0.5s ease, opacity 0.5s ease; transition-delay: 1.5s; font-size: clamp(1.6rem, 0.9375vw, 2.4rem ); width: max(30rem, 15.62vw);}
.org-item > div{height: max(8rem, 4.016vw);  display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 15px; }
.org-item .cont{background-color: #fff; text-align: center;}
.org-item .title{background-color: #001e40; text-align: center; color: #fff; line-height: 1;}
.org-item .title strong {margin-top: 5px;}
.org-item .cont + .cont {border-top: 1px solid #727273}

.org-item.chairman {transition: transform 0.5s, opacity 0.5s}
.org-item.chairman .title{position: relative; color: #fff; line-height: 1; font-weight: 700; background-color: #187ef2; }

.depth3 .org-item{width: max(20rem, 10.41vw); transition-delay: 2.5s;}
.depth4 .org-item{width: max(20rem, 10.41vw); transition-delay: 3.5s;}
.org-wrap .depth3 .depth-line .line.full:before{transition-delay: 2s;}
.org-wrap .depth3 .box .line:before{transition-delay: 2.5s;}
.org-wrap .depth4 .box .line:before{transition-delay: 3.5s;}
 
.org-wrap .depth-line {position: absolute; top: 0; width: 100%;}
.org-wrap .depth-line .line {position: relative; height: 1px; background-color: #727273 }
.org-wrap .depth-line .line.full {width: calc(((100% - 36px) + 36px - ((100% - 36px)/4))); margin-left: calc(((100% - (12px * 3))/4) / 2);}
.org-wrap .depth-line .line.full:before {content: ""; display: block; position: absolute; width: 105%; height: 4px; left: -1px; bottom: -1px ;background-color: #fff; transition: all .25s; transition-delay: 1s}

.org-wrap .box {position: relative; flex: 1; font-size: 1.8rem;}
.org-wrap .box + .box {margin-left: 12px;}

.org-wrap .box .line {position: absolute; left: 50%; top: 0; transform: translate(0, -100%); height: 7.5rem; width: 1px; background-color: #727273; margin-left: -1px;}
.org-wrap .box .line:before {content: ""; display: block; position: absolute; width: 3px; height: 105%; right: -1px; bottom: -1px ;background-color: #fff; transition: all 0.75s; transition-delay: 1.25s}
.org-wrap .box.no-line .line {display: none}

.org-wrap.active .depth .box .org-item,
.org-wrap.active .chairman{opacity: 1; transform: translateY(0)}

.org-wrap.active .depth-line .line.right:after,
.org-wrap.active .chairman .line:before ,
.org-wrap.active .depth-line .line:before {width: 0}

.org-wrap.active .depth1 .line:before,
.org-wrap.active .depth2 .box .line:before,
.org-wrap.active .depth3 .box .line:before {height: 0}


/*
.org-wrap.pt .depth1{padding-bottom: 3.5rem;}
.org-wrap.pt .depth2{padding-right: 9.896vw; padding-left: 9.896vw; justify-content: space-between; padding-bottom: 3.5rem; padding-top: 3.5rem;}
.org-wrap.pt .box{flex: 0;}
.org-wrap.pt .depth2 .org-item .title{background-color: #143d66;}
.org-wrap.pt .box .line{height: 3.5rem;}
.org-wrap.pt .box + .box{margin-left: 0;}
.org-wrap.pt .depth-line{width: calc(100% - 19.791vw);}
.org-wrap.pt .depth-line .line.full{width: calc(100% - max(30rem, 15.62vw)); margin-left: max(15rem, 7.81vw);}
.org-wrap.pt .depth3 .depth-line{width: 100%;}
.org-wrap.pt .depth3 .depth-line .line.full{margin-left: max(10rem, 5.21vw); width: calc(100% - max(20rem, 10.42vw));}
.org-wrap.pt .depth3{padding-top: 3.5rem;}
.org-wrap.pt .depth1 .line{height: 212.8%;}
*/

.org-wrap ul{display: flex; justify-content: space-between; width: 100%;}
.org-wrap ul li{flex: 1;}
.org-wrap ul li + li{margin-left: 2rem;}
.org-wrap ul li .box .line{height: 3.5rem;}
.org-wrap ul li .org-item .title strong{margin-top: 0;}
.org-wrap ul li .depth1{padding-bottom: 3.5rem;}
.org-wrap ul li .depth1 .line:before {transition-delay: 1.75s}

.org-wrap ul li .depth1 .box{flex: 0;}
.org-wrap ul li .depth1 .org-item{width: max(22rem, 12vw);}
.org-wrap ul li .depth2 .org-item{width: 100%;}
.org-wrap ul li .depth2{padding-top: 3.5rem; padding-bottom: 3.5rem;}
.org-wrap ul li .depth2 .box{flex: 1;}

.org-wrap ul li .depth3{padding-top: 3.5rem;}

.org-wrap ul li:last-child .depth1{padding-bottom: 0;}
.org-wrap ul li:last-child .depth1 .org-item .title{line-height: 1.3;}
.org-wrap ul li:last-child .depth2{justify-content: center;}
.org-wrap ul li:last-child .depth2 .org-item{width: max(22rem, 12vw);}
.org-wrap ul li:last-child .depth2 .box{flex: 0;}
.org-wrap ul li:last-child .depth2 > .line{height: calc(100% - 3.5rem); position: absolute; width: 1px; background-color: #727273; bottom: 0;}
.org-wrap ul li:last-child .depth2 > .line:before {content: ""; display: block; position: absolute; width: 3px; height: 100%; left: -1px; bottom: -1px; background-color: #fff; transition: all 0.5s; transition-delay: 2s;}

.org-wrap.world .depth1 .line{margin-left: 0;}
.org-wrap.world .depth2 .org-item .title{background-color: #143d66;}
.org-wrap.world .depth2{justify-content: space-between; padding-bottom: 3.5rem; padding-top: 3.5rem;}
.org-wrap.world .depth2 .depth-line .line.full{width: calc(((100% - 40px) + 40px - ((100% - 40px) / 3))); margin-left: calc(((100% - (20px * 2)) / 3) / 2);}

.org-wrap.world ul li:first-child .depth-line .line.full {width: calc(((100% - 24px) + 24px - ((100% - 24px) / 3))) !important; margin-left: calc(((100% - (12px * 2)) / 3) / 2) !important; }
.org-wrap.world ul li .depth-line .line.full {width: calc(((100% - 12px) + 12px - ((100% - 12px) / 2))) !important; margin-left: calc(((100% - (12px * 1)) / 2) / 2) !important;}
.org-wrap.active ul li:last-child .depth2 .line:before{height: 0;}

.org-wrap.world ul li .depth2 .org-item .title{background-color: #001e40;}
.org-wrap.world ul li .depth3 .org-item .title{background-color: #001e40;}

/* .org-wrap.world .depth1{padding-bottom: 3.5rem;}
.org-wrap.world .box{flex: 0;}
.org-wrap.world .box .line{height: 3.5rem;}
.org-wrap.world .box + .box{margin-left: 0;}
.org-wrap.world .depth-line{width: calc(100% - 19.791vw);}
.org-wrap.world .depth-line .line.full{width: calc(100% - max(30rem, 15.62vw)); margin-left: max(15rem, 7.81vw);}
.org-wrap.world .depth3 .depth-line{width: 100%;}
.org-wrap.world .depth3 .depth-line .line.full{margin-left: max(10rem, 5.21vw); width: calc(100% - max(20rem, 10.42vw));}
.org-wrap.world .depth3{padding-top: 3.5rem;}
.org-wrap.world .depth1 .line{height: 212.8%;} */

.org-cont.horizontal{margin-top: 0;}
.org-wrap.horizontal{margin-top: 0;}
.org-wrap.horizontal .org-container{display: flex; align-items: center;}
.org-wrap.horizontal .depth{flex-direction: column; padding-top: 0; padding-left: max(3rem, 3.646vw);  width: auto;}
.org-wrap.horizontal .depth1{padding-bottom: 0; padding-right: max(3rem, 3.646vw); padding-left: 0;}
.org-wrap.horizontal .depth1 .line{top: 50%; left: 0; width: 100%; height: 1px;}
.org-wrap.horizontal .depth1 .line:before{background-color: #f5f5f5; height: 3px; width: 100%; left: auto; right: -1px;}
.org-wrap.horizontal .box + .box{margin-left: 0; margin-top: 9rem;}
.org-wrap.horizontal .depth2 .org-item{width: max(20rem, 10.42vw)}

.org-wrap.horizontal .box .line{left: 0; top: 50%; width: max(3rem, 3.646vw); height: 1px; transform: translate(-100%, 0);}
.org-wrap.horizontal .box .line:before{background-color: #f5f5f5; height: 3px; width: 105%; }
.org-wrap.horizontal .depth-line{height: 100%; left: 0;}
.org-wrap.horizontal .depth-line .line.full:before{background-color: #f5f5f5; height: 105%; width: 4px; left: auto; right: -1px;}
.org-wrap.horizontal .depth-line .line.full{height: calc(100% - 24rem - 1px); margin-top: calc(12rem + 1px); margin-left: 0; width: 1px;}

.org-wrap.horizontal.active .depth-line .line.right:after, .org-wrap.horizontal.active .chairman .line:before, .org-wrap.horizontal.active .depth-line .line:before{height: 0;}
.org-wrap.horizontal.active .depth1 .line:before, 
.org-wrap.horizontal.active .depth .box .line:before{width: 0;}
.org-wrap.horizontal .org-item{transform: translateX(50px) translateY(0);}
.org-wrap.horizontal.active .depth .box .org-item, .org-wrap.horizontal.active .chairman{transform: translateX(0);}


.org-wrap.cfc .org-item{width: 300px;}
.org-wrap.cfc .depth3 .org-item{width: 200px;}

.org-wrap.cfc .depth1{padding-bottom: 3.5rem;}
.org-wrap.cfc .depth2{justify-content: center; padding-bottom: 3.5rem; padding-top: 3.5rem;}
.org-wrap.cfc .box{flex: 0;}
.org-wrap.cfc .depth2 .org-item .title{background-color: #143d66;}
/* .org-wrap.cfc .depth2 .box{margin-left: 30rem;} */
.org-wrap.cfc .depth2 .box + .box{position: absolute; left: 50%; transform: translate(-50%, 0); padding-left: 0; margin-left: max(39rem, 20.3125vw);}
.org-wrap.cfc .box .line{height: 3.5rem; margin-left: -1px;}
.org-wrap.cfc .box .line.bottom{bottom: 0; top: auto; transform: translate(0, 100%);}
.org-wrap.cfc .box .line.bottom:before{transition-delay: 1.75s;}

.org-wrap.cfc .box + .box{margin-left: 0;}
.org-wrap.cfc .depth-line{width: 50%; left: 50%;}
.org-wrap.cfc .depth-line .line.full{width: max(39rem, 20.3vw); margin-left: 0;}

.org-wrap.cfc .depth3 .depth-line{width: 100%; left: 0;}
.org-wrap.cfc .depth3 .depth-line .line.full{margin-left: 10rem; width: calc(100% - 20rem);}
.org-wrap.cfc .depth3{padding-top: 3.5rem;}



.sub .rel-wrap .section-header{margin-bottom: 0;}
.rel-wrap .section-page.basic-section{padding-bottom: 0; padding-top: 0;}


.rel-item{margin-top: 8rem;}
.rel-item .title{margin-right: auto;}
.rel-item .title h4{font-size: clamp(2.4rem, 2.1vw, 4rem); font-weight: 600; line-height: 1.35;}
.rel-item .cont{display: flex; margin-top: 2rem;}
.rel-item .cont .logo{border: 1px solid #ccc; width: 24rem; height: 16rem; background-color: #fff; flex-shrink: 0;}
.rel-item .cont .text{margin-left: 2rem; flex-grow: 1;}
.rel-item .cont .text p{font-size: 1.8rem; margin-bottom: 1.8rem; line-height: 1.78;}
.rel-item .cont .text a{width: 20rem; height: 4rem; padding: 0; line-height: 4rem; color: #fff; background-color: #323233;}
.rel-item .cont .text a:hover{background-color: #003bb3;}

.rel-item.pt .cont .logo{background: url('../images/company/logp-pt.png') no-repeat center/63%;}
.rel-item.cfc .cont .logo{background: #fff url('../images/company/logp-cfc.png') no-repeat center/50%;}
.rel-item.tow .cont .logo{background: url('../images/company/logp-tow.png') no-repeat center/63%;}



.history-wrap {margin-top: 10rem; display: flex; align-items: flex-start; justify-content: space-between;}
.history-wrap .left {position: sticky; top: 8rem; padding-right: 6rem;}
.history-wrap .left h4{font-size: clamp(2.2rem, 2.0834vw, 5rem); font-weight: 600; line-height: 1.2}
.history-wrap .left p{font-size: clamp(1.6rem, 0.9375vw, 2.4rem) ; color: #187ef2; margin-top: 0.7rem;}
.history-wrap .left img{margin-top: 4rem;}
.history-wrap .cont {position: relative; width: 100%; margin-top: 12rem;}
.history-wrap .cont .line {position: absolute; left: 0; top: 50%; transform: translateY(-50%) ;width: 1px; height: 99% !important; background-color: #e0e0e0}
.history-wrap .cont .line .bg {position: absolute; left: 50%; top: 0; width: 2px ;height: 0%; transform: translateX(-50%) ;background-color: #69B6FA; max-height: 100%;}
.history-wrap .cont li {position: relative; }
.history-wrap .cont li:last-child:before {content: ""; position: absolute; width: 12px; height: 100%; left: 0%; top: 10px; transform: translateX(-50%) ;background-color: #fff; }
.history-wrap .cont li + li {margin-top: 4em}
.history-wrap .cont li .item {position: relative; padding-left: 6rem;}
.history-wrap .cont li .item:before {content: ""; position: absolute; left: -5px; top: 10px; width: 11px; height: 11px; border-radius: 50%; background-color: #ccc; }
.history-wrap .cont li .item .year {font-size: clamp(2.2rem, 1.667vw, 4.2rem) ; line-height: 1; font-weight: 600; z-index: 3; font-family: 'Spoqa Han Sans Neo', sans-serif;;}
.history-wrap .cont li .item p {font-size: clamp(1.6rem, 0.9375vw, 2.4rem); margin-top: 1.5rem; line-height: 1.45;}
.history-wrap .cont li .item p + p {margin-top: 1rem}
.history-wrap .cont li:nth-child(1) .item:before,
.history-wrap .cont li.active .item:before {background-color: #187ef2; box-shadow: 0 0 0px 8px rgba(240,245,252,0.8)}




.location-wrap{position: relative;}
.location-wrap + .location-wrap{margin-top: 15rem;}
.location-wrap .map-wrap{width: 100%; height: 500px; background-color: #eee;}
.location-info{display: flex; margin-top: 6rem;}
.location-info .title{flex-shrink: 0; }
.location-info .title h4{font-size: clamp(2.2rem, 2.0834vw, 5rem); line-height: 1.3;}
.location-info .cont{margin-left: 8rem; padding-left: 8rem; position: relative; flex-grow: 1;}
.location-info .cont::before{position: absolute; top: 0; left: 0; width: 1px; height: 100%; background-color: #ccc; content: ''; }

.location-info .cont .item{display: flex; font-size: clamp(1.6rem, 0.9375vw, 2.4rem);}
.location-info .cont .item .icons{margin-right: 1rem; width: 20px; display: inline-block; flex-shrink: 0; text-align: center;}
.location-info .cont .item .icons .icon{margin-top: 3px;}
.location-info .cont .item .text{flex-grow: 1; display: flex;}
.location-info .cont .item .text span{margin-left: 2rem; flex-grow: 1;}
.location-info .cont .item .text em{font-style: normal; width: 10%; text-align: justify; flex-shrink: 0;}

.page-cfc .location-info .cont .item .text em{width: 14%;}
.page-business .location-info .cont .item .text em{width: 8%;}
.global-ko .location-info .cont .item .text em.lt-word{letter-spacing: 16px;}
.location-info .cont .item + .item{margin-top: 1rem;}
.ico-pin{background-image: url('../images/icons/ico-pin.png'); width: 12px; height: 18px;}
.ico-call{background-image: url('../images/icons/ico-call.png'); width: 18px; height: 18px;}
.ico-fax{background-image: url('../images/icons/ico-fax.png'); width: 16px; height: 18px;}

.global-en .location-info .cont{margin-left: 7rem; padding-left: 7rem;}
.global-en .location-info .title h4{font-size: clamp(1.8rem, 1.25vw, 3.2rem);}

.global-en .location-info .cont .item .text em{width: 1px;}
.global-en .location-info .cont .item .text span{margin-left: 0.5rem;}

.global-ja .location-info .title h4{font-size: clamp(1.8rem, 1.666667vw, 4.8rem);}
.global-ja .location-info .cont .item .text em{width: 1px;}
.global-ja .location-info .cont .item .text span{margin-left: 0.5rem;}

/**** 
** ## BUSINESS
*****/
.sub .sub-visual .section-header{margin-bottom: 0;}
.sub-visual{padding-top: 15rem; padding-bottom: 4rem; border-bottom: 1px solid #ccc;}
.sub-visual .image-wrap {display: block; overflow: hidden; position: relative;}
.sub-visual .image-wrap .image {margin: 0 auto; overflow: hidden; position: relative; background-color: #f0f0f0; opacity: 0;}
.sub-visual .image-wrap .image img {display: block; position: absolute; left: 50%; width: 100vw; height: 100%; object-fit: cover; transform: translateX(-50%); }
.sub-visual .image-wrap .image iframe {position: relative;}
.sub-visual .image-wrap .image video {display: block; position: absolute; left: 50%; width: 100vw; height: 100%; object-fit: cover; transform: translateX(-50%); }
.sub-visual .image-wrap .dim {position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; }
.sub-visual[data-type=pin] .image-wrap .image {--wide: max(4.8rem, 7.8125vw); height: 45vw; width: calc(100% - var(--wide, 0)* 2); }
.sub-visual[data-type=pin] .image-wrap .dim.gradient {background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%); }
.sub-visual[data-type=pin] .image-wrap .dim.solid {background-color: rgba(0, 0, 0, .2); }

.sub-visual .space {height: 7.813vmax;}
.sub-visual .desc-wrap .space {height: 5.209vmax;}
.sub-visual[data-type=pin]{padding: 0; border-bottom: 0;}
.sub-visual[data-type=pin] .desc-wrap:not(.focus) {visibility: hidden;}
.sub-visual[data-type=pin] .desc-wrap.focus .container:not(.focus){position: relative; z-index: 1; clip-path: polygon(0 calc(100% - var(--crop, 100%)), 100% calc(100% - var(--crop, 100%)), 100% 0, 0 0); }
.sub-visual[data-type=pin] .desc-wrap.focus {position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, var(--pin, 0px), 0); will-change: transform;}
.sub-visual[data-type=pin] .desc-wrap.focus .container.focus {position: absolute; bottom: 0; left: 0; color: #fff; clip-path: polygon(0 100%, 100% 100%, 100% calc(100% - var(--crop,  100%)), 0% calc(100% - var(--crop, 100%))); }
.sub-visual[data-type=pin] .desc-wrap.focus .container.focus .breadcrumb-item.active a{color: #fff;}

.sub-visual[data-type=scale]{border-bottom: 0; padding-bottom: 0;}
.sub-visual[data-type=scale] .image-wrap{margin-top: 8.5rem;}
.sub-visual[data-type=scale] .image-wrap .image {position: relative; height: 35.417vw; background-color: transparent;}
.sub-visual[data-type=scale] .image-wrap .image img {--wide: max(4.8rem, 16.6666vw); width: calc(100% - var(--wide, 0)* 2); will-change: transform}
.sub-visual[data-type=scale] .image-wrap .image video {--wide: max(4.8rem, 16.2236vw); width: calc(100% - var(--wide, 0)* 2); will-change: transform}
.sub-visual[data-type=scale] .image-wrap .dim.gradient {background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%); }
.sub-visual[data-type=scale] .image-wrap .dim.solid {background-color: rgba(0, 0, 0, .2); }


.overview-container .section-header{margin-bottom: max(6rem, 5.2vw);}
.overview-container .section-desc{font-weight: 500; margin-top: 1rem;}
.overview-container .swiper{margin-bottom: max(6rem, 5.2vw);}

.cate span{display: inline-block; background-color: #143d66; color: #fff; font-size: clamp(1.6rem, 1.25vw, 3.2rem); min-width: 160px; height: 34px; text-align: center; line-height: 34px; padding: 0 1.335rem;}
.content-wrap{display: flex; justify-content: space-between;}
.content-wrap .head{flex-shrink: 0; width: 31.25%;}
.content-wrap .head .cate{margin-top: 1.75rem;}
.content-wrap .cont{margin-left: auto; flex-grow: 1;}
.content-wrap .cont p{font-size: clamp(1.6rem, 1.25vw, 3.2rem); margin-bottom: 5.5rem; line-height: 1.42;}
.content-wrap .cont .table-wrap table{font-size: clamp(1.4rem, 0.9375vw, 2.4rem);}
.content-wrap .cont .table-wrap table th{padding: 1.4rem 3rem; font-weight: 500; width: 25%;}
.content-wrap .cont .table-wrap table td{padding: 1.4rem 2rem;}
.counter-wrap .image img{width: 100%;}

.content-wrap.overview .cont{margin-left: 14%;}
.content-wrap.overview .cont p{color: #323233;}

.global-en .content-wrap .cont .table-wrap table th{width: 30%;}


.text-pt{position: absolute; top: -5.5%; width: 100%; padding: 0 2.5vw; font-size: clamp(5.4rem, 4.688vw, 10.8rem); line-height: 1; color: #fff;}
.text-pt svg{height: 100%;}
.text-pt svg text{opacity: 1;}

.logo-pt{position: absolute; bottom: -12%;}
.logo-pt img{opacity: 0.4;}

.text-pt2{text-align: center; position: relative;}
.text-pt2 img{width: auto; max-width: 100%;}



.counter-wrap{position: relative;}
.counter-wrap .image{margin-bottom: 6rem;}
.counter-wrap .item-list{display: flex; }
.counter-wrap .item{background-color: transparent; padding: 3rem; color: #999; font-size: 1.8rem; flex: 1; border: 1px solid #ccc; cursor: pointer; transition: all ease .3s; position: relative; margin-left: -1px;}
.counter-wrap .item .line{width: 30px; height: 2px; background-color: transparent; display: inline-block;}
.counter-wrap .item .line.bg{position: absolute; top: 2rem; }
.counter-wrap .item p{margin-bottom: 1rem;}
.counter-wrap .item p span{font-size: 1.6rem; display: block;}
.counter-wrap .item .text .counter{font-size: clamp(4rem, 2.8125vw, 7.2rem); line-height: 1; font-family: 'Spoqa Han Sans Neo', sans-serif; font-weight: 500; line-height: 0.8;}
.counter-wrap .item.active{background-color: #fff; color: #003bb3; border-color: #003bb3; z-index: 2;}
.counter-wrap .item.active .line{background-color: #003bb3;}

.counter-swiper .swiper-slide .item{display: none;}

/* .counter-wrap .item-list .item:last-child p{margin-top: -2.1rem; font-size: 1.6rem;} */
/* .counter-wrap .item-list .item:last-child.active .line{background-color: transparent;}
.counter-wrap .item-list .item:last-child.active .line.bg{background-color: #003bb3;} */
/* .counter-wrap .item-list .item:last-child .line{position: absolute; top: 2rem;} */

.counter-wrap .item-list .item .text{display: flex; align-items: flex-end;}
.counter-year .odometer-formatting-mark{color: #fff; margin-left: -10px;}

.global-en .page-business .content-wrap .section-title{font-size: clamp(2.4rem, 1.6667vw, 5.4rem);}
.global-en .page-business .content-wrap .cont p{font-size: clamp(1.6rem, 1.0417vw, 2.4rem);}
.global-en .counter-wrap .item{padding: 3rem 2rem;}
.global-en .counter-wrap .item p{height: 6rem;}
.global-en .counter-wrap .item .unit{font-size: 1.6rem; margin-left: 3px;}
.global-en .counter-wrap .item .text .counter{font-size: clamp(3.2rem, 2.2917vw, 5.4rem);}


.production{position: relative;}
.production ul{display: flex; align-items: center; margin: 0 -1rem;}
.production ul li{flex: 1; padding: 0 1rem;}
.production ul li .inner{background-color: #f9f9f9; padding: 4rem 3rem;}
.production ul li .line{width: 30px; height: 2px; background-color: #ccc; margin: 2.5rem 0 1.5rem;}
.production ul li .text{font-weight: 500; align-items: flex-end; display: flex;}
.production ul li .text .counter{font-size: clamp(3.2rem, 2.0834vw, 5.4rem); font-family: 'Spoqa Han Sans Neo', sans-serif; display: inline-block; line-height: 1;}
.production ul li .text .unit{margin-left: 5px; font-size: 1.8rem;}
.production ul li .cate{background-color: #187ef2; color: #fff; width: 70px; height: 34px; line-height: 34px; text-align: center; display: inline-block; border-radius: 4px; font-weight: 500; font-size: 1.8rem;}
.production .desc{text-align: right; margin-top: 1.6rem; }
.production .desc span{color: #727273; border-radius: 16px; border: 1px solid #727273; display: inline-block; padding: 2px 20px;}

.global-ja .production ul li .cate{width: auto; padding: 0 1rem;}

.general-swiper{position: relative;}
.swiper-nav div{text-indent: -9999px; background-size: cover;}
/* .general-swiper .swiper-nav{position: absolute; right: 0; width: 82px; height: 36px; bottom: 14px;} */
.general-swiper .swiper-nav .swiper-button-prev{left: -90px; background-image: url('../images/icons/btn-slide-pre-d.png');}
.general-swiper .swiper-nav .swiper-button-next{right: -90px; background-image: url('../images/icons/btn-slide-next-d.png');}
.general-swiper .swiper-nav .swiper-button-prev:hover{background-image: url('../images/icons/btn-slide-pre-h.png');}
.general-swiper .swiper-nav .swiper-button-next:hover{background-image: url('../images/icons/btn-slide-next-h.png');}
.general-swiper .swiper-nav div{width: 60px; height: 60px;}
.general-swiper .swiper-slide img{width: 100%; }


.rel-swiper .swiper-nav{position: absolute; width: 100%; top: 50%; margin-top: -36px;}
.rel-swiper .swiper-nav .swiper-button-prev{left: 0; background-image: url('../images/icons/btn-slide-pre-d.png');}
.rel-swiper .swiper-nav .swiper-button-next{right: 0; background-image: url('../images/icons/btn-slide-next-d.png');}
.rel-swiper .swiper-nav .swiper-button-prev:hover{background-image: url('../images/icons/btn-slide-pre-h.png');}
.rel-swiper .swiper-nav .swiper-button-next:hover{background-image: url('../images/icons/btn-slide-next-h.png');}
.rel-swiper .swiper-nav div{width: 72px; height: 72px;}


.mng-wrap{position: relative; margin-top: 10rem;}
.mng-wrap ul{display: flex; justify-content: space-between; padding: 0 max(4rem, 5.18vw); margin-bottom: 6rem;}
.mng-wrap ul li{border-radius: 50%; display: flex; align-items: center; justify-content: center; width: max(28rem, 15.625vw); height: max(28rem, 15.625vw); background-color: #888; text-align: center;}
.mng-wrap ul li:nth-child(1){background-image: url('../images/business/circle-01.png');}
.mng-wrap ul li:nth-child(2){background-image: url('../images/business/circle-02.png');}
.mng-wrap ul li:nth-child(3){background-image: url('../images/business/circle-03.png');}
.mng-wrap ul li span{color: #fff; font-size: clamp(1.8rem, 1.25vw, 3.2rem); font-weight: 600;}

.mng-wrap .desc{border: solid 2px #143d66; height: max(6rem, 5.209vw); line-height: max(6rem, 5.209vw); margin-top: 6rem; background: url('../images/business/m-pattern-02-v2.png') repeat center; position: relative; isolation: isolate;}
.mng-wrap .desc::after{content: ''; position: absolute; background: white; z-index: -1; inset: 0; opacity: 0.6;}
.mng-wrap .desc p{text-align: center; color: #143d66; font-size: clamp(1.8rem, 1.25vw, 3.2rem) ; font-weight: 600;}
.ico-mng-arrow{width: 64px; height: 150px; background-image: url('../images/business/arrow-02.png');}


.section-page.awards-section{padding-bottom: 14rem;}
.awards-list .grid-item{margin-bottom: 6rem;}
.awards-list .grid-item .grid-image-wrap{margin-bottom: 1rem;}
.awards-list .grid-item .grid-content{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); line-height: 1.35;}


.contribution-wrap .image{margin: 10rem 0 1rem;}
.contribution-wrap .desc{height: max(8rem, 4vw); line-height: max(8rem, 4vw); background: #143d66 url('../images/business/pattern-line-white.png') repeat center }
.contribution-wrap .desc p{text-align: center; color: #fff; font-size: clamp(1.8rem, 1.25vw, 3.2rem); font-weight: 600;}


.cb2-wrap{display: flex;}
.cb2-wrap .image{flex-shrink: 0;}
.cb2-wrap .image img{margin-bottom: 1rem;}
.cb2-wrap .image p{font-size: clamp(1.4rem, 0.9375vw, 2.4rem); color: #727273;}
.cb2-wrap .cont{flex-grow: 1; margin-left: 6rem; font-size: clamp(1.6rem, 1.25vw, 3.2rem) ;}/* 2.4rem */
.cb2-wrap .cont .dash .label{width: 25px;}
.cb2-wrap .cont .dash .text{width: calc(100% - 30px);}
.cb2-wrap .cont .dash .label em{border-radius: 50%; width: 10px; height: 10px; border-radius: 10px; background-color: #187ef2; display: inline-block;}
.cb2-wrap .cont .tags{display: flex; flex-wrap: wrap; margin-top: 3rem;}
.cb2-wrap .cont .tags li{padding: 1rem 0.5rem;}
.cb2-wrap .cont .tags span{background-color: #fff; display: inline-block; padding: 0.5rem 1rem; color: #143d66; font-size: clamp(1.6rem, 0.9375vw, 2.4rem);}


.mfp-content img.mfp-img{max-height: 80vh !important;}


.customer-wrap{margin-top: max(6rem, 7.45vw);}
.customer-wrap .group h4{font-size: clamp(2.4rem, 2.0834vw, 5.4rem); font-weight: 600; line-height: 1;}
.customer-wrap .group .image{margin-top: 3rem; border: 1px solid #ccc;}
.customer-wrap .group img{width: 100%;}




/**** 
** ## CFC
*****/
.cate-cfc span{background-color: #c3b286;}
.page-cfc .content-wrap .head{flex-shrink: 0; width: 510px;}
.page-cfc .content-wrap .cont{flex-grow: 1; margin-left: 7.5rem;}
.page-cfc .content-wrap.overview .cont p{letter-spacing: -0.65px;}

.global-en .page-cfc-history .section-title{font-size: clamp(2.4rem, 2.08334vw, 5.4rem);}

.mfp-wrap .mfp-container{padding: 0;}
.mfp-pop-wrap{height: 100vh;}
.mfp-pop-wrap .swiper-slide{height: 100%;}
.mfp-pop-wrap .swiper-slide img{position: relative; max-width: 100%; height: 100vh; object-fit: cover; display: block; margin: 0 auto;}
.mfp-pop-wrap .mfp-pop-header{height: 44px; background-color: #000; opacity: 0.4; position: absolute; top: 0; left: 0; width: 100%; z-index: 3;}
.mfp-pop-wrap .swiper-num-wrap{color: #fff; display: inline-block; width: auto; padding: 10px; position: relative; z-index: 2; top: 0;}

.mfp-pop-wrap .swiper-slide .autowrap .autosize{padding-bottom: 0 !important;}
.mfp-pop-wrap .swiper-slide .autowrap iframe{width: 100%; height: 100vh; object-fit: cover;}


.core-wrap{margin-top: max(4rem, 4.85vw); display: flex; justify-content: space-between;}
.core-wrap .item{background-position: center; background-size: cover; background-repeat: no-repeat; border-radius: 10px; flex: 1; position: relative; }/* height: max(28rem, 21.3545vw); */
.core-wrap .item + .item{margin-left: 4rem;}
/* height: 410px; width: 100%; max-width: 400px;  */
.core-wrap .item img{width: 100%;}
.core-wrap .item .inner{padding: max(6rem, 3.15vw) max(3rem, 1.45vw); position: absolute; top: 0; left: 0; right: 0; height: 100%;}
.core-wrap .item .title{color: #fff; font-size: clamp(2.4rem, 2.0834vw, 4rem); font-weight: 400; line-height: 1.3; letter-spacing: -1px;}
/* .core-wrap .item.core-01{background-image: url('../images/cfc/core-01.png');}
.core-wrap .item.core-02{background-image: url('../images/cfc/core-02.png');}
.core-wrap .item.core-03{background-image: url('../images/cfc/core-03.png');} */

.core-gallery{border-top: 1px solid #ccc;}

.core-factory .title span{display: inline-block; background-color: #c3b286; color: #fff; font-size: clamp(1.8rem, 1.25vw, 3.2rem); padding: 0 max(1rem, 0.695vw); height: max(3.4rem, 1.771vw); line-height:  max(3.4rem, 1.771vw); text-align: center;}
.core-factory .dash li{padding: 4rem 3rem; border-top: 1px solid #ccc; align-items: center;}
.core-factory .dash li:last-child{border-bottom: 1px solid #ccc;}
.core-factory .dash li .label{margin-right: 3rem; width: auto; font-size: 0;}
.core-factory .dash li .text{font-size:  clamp(1.6rem, 0.9375vw, 2.4rem);}
.ico-check-sq{background-image: url('../images/cfc/ico-check-v2.png'); width: 25px; height: 25px;}

.global-en .core-wrap .item .title{font-size: clamp(1.8rem, 1.25vw, 4rem);}
.global-ja .core-wrap .item .title{font-size: clamp(2.4rem, 1.6667vw, 4rem);}


.section-video{position: relative; overflow: hidden; margin-bottom: max(6rem, 5.21vw);}
.section-video .video-wrap{position: relative; height: max(68rem, 35vw);}
.section-video .video-wrap .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.section-video .video-wrap .bg::before{content: ''; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #000; opacity: 0.4; }
.section-video .video-wrap .cont {display: table; width: 100%; height: 100%; z-index: 1; position: relative;}

.video-background-controls button {font-size: 24px; display: inline-block; padding: 0px; margin: 0px; height: 24px; width: 24px; border-radius: 16px; line-height: 32px; border: none; background: none; appearance: none; color: white; filter: drop-shadow(0px 0px 1px black); cursor: pointer; opacity: 1; transition: all 250ms ease-in-out; margin-left: 10px; }
.video-background-controls button:hover {opacity: 0.5; }
.seek-bar-wrapper {height: 6px; background: var(--seek-bar-background); position: relative; width: calc(100% - 32px); position: absolute; bottom: 16px; left: 16px;}
.seek-bar-progress {-webkit-appearance: none; -moz-appearance: none; appearance: none; overflow: hidden; background: transparent !important; border: 0; position: absolute; width: 100%; height: 100%; top: 0; 	left: 0; z-index: 1;}
.seek-bar-progress::-webkit-progress-bar {background: transparent; }
.seek-bar-progress::-webkit-progress-value {background: var(--seek-bar-progress-background); }
.seek-bar-progress::-moz-progress-bar {background: var(--seek-bar-progress-background); }
.seek-bar {-webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; top: calc(50% - 10px); z-index: 1; display: block; width: 100%; height:  20px; margin: 0; cursor: pointer; background: transparent; }
.seek-bar::-webkit-slider-runnable-track {-webkit-appearance: none; appearance: none; height: 6px; cursor: pointer; background: transparent; border: 0; border-radius: 0; }
.seek-bar::-moz-range-track {-moz-appearance: none; appearance: none; width: 100%; height: 6px; cursor: pointer; background: transparent; border: 0; border-radius: 0;}
.seek-bar::-webkit-slider-thumb {-webkit-appearance: none; appearance: none; width: 12px; height: 12px; margin-top: 3px; cursor: pointer; background: var(--seek-bar-thumb-color); border: 0; border-radius: 8px; transform: translateY(-50%); transition: opacity 0.4s ease-in-out;}
.seek-bar::-moz-range-progress {margin-top: 0; background: transparent; border: 0;}
.seek-bar::-moz-range-thumb {-moz-appearance: none; appearance: none; width: 16px; height: 16px; margin-top: 0; cursor: pointer; background: var(--seek-bar-thumb-color); border: 0; border-radius: 8px; transition: opacity 0.4s ease-in-out; }
.seek-bar-wrapper ::-webkit-slider-thumb {opacity: 0; }
.seek-bar-wrapper ::-moz-range-thumb {opacity: 0; }
.seek-bar-wrapper:hover .seek-bar:not([disabled])::-webkit-slider-thumb {opacity: 1; }
.seek-bar-wrapper:hover .seek-bar:not([disabled])::-moz-range-thumb {opacity: 1; }



.process-wrap  h4 {font-size: clamp(2.4rem, 2.1vw, 4rem); font-weight: 600; line-height: 1.35; color: #fff;}
.process-wrap .grid-list .grid-item{margin-top: max(3rem, 5.20834vw); flex: 0 0 45.313%; width: 45.313%;}
.process-wrap .grid-list .grid-item:nth-child(2n){margin-left: 9.374%;}
.process-wrap .grid-item .grid-image{margin-bottom: 1rem;}
.process-wrap .grid-item .grid-image img{width: 100%; }
.process-wrap .grid-item .grid-image .img-b{opacity: 0; position: absolute; top: 0; left: 0;}

.process-wrap .grid-item .grid-content dl{display: flex; align-items: center; background-color: #212121;}
.process-wrap .grid-item .grid-content dl + dl{margin-top: 5px;}
.process-wrap .grid-item .grid-content dt{background-color: #212121; color: #f5f5f5; flex-shrink: 0; width: 18rem; display: flex; align-items: center; padding: 1.5rem 3rem;}
.process-wrap .grid-item .grid-content dd{background-color: #19191a; color: #f5f5f5; flex-grow: 1; padding: 1.5rem 3rem; height: 100%;  display: flex; align-items: center; }
.global-ja .process-wrap .grid-item .grid-content dd{display: block; width: calc(100% - 18rem);}


.page-process .bg-01{background: url('../images/cfc/process/bg-01.webp') no-repeat center/cover;}
/* .page-process .bg-02{background: url('../images/cfc/process/bg-02-1.png') no-repeat center/cover;} */
.page-process .bg-03{background: url('../images/cfc/process/bg-03.webp') no-repeat center/cover;}
/* .page-process .bg-04{background: url('../images/cfc/process/bg-04.webp') no-repeat center/cover;} */

.guide-line{position: fixed; top: 50%; background-color: #fff; width: 100%; height: 1px;}

.process-detail .pop-wrap{max-width: 1210px;}
.process-detail .pop-content{padding: 6rem 2rem 4rem;}
.process-detail .pop-content img{width: 100%;}
.process-detail .pop-wrap .btn-close{top: 1.5rem; right: 2rem;}


/**** 
** ## BRAND
*****/
#brand-info .section-desc{font-family: 'Spoqa Han Sans Neo'; font-size: clamp(1.6rem, 1.25vw, 3.2rem);}
.rnd-wrap{max-width: 96rem; margin: 0 auto; margin-top: max(4rem, 5.20834vw);}
.rnd-wrap .swiper-nav{position: absolute; width: 100%; top: 33.1%;}
.rnd-wrap .swiper-slide{text-align: center; }
.rnd-wrap .swiper-slide .image{margin-bottom: max(2rem, 2.08334vw); }
.rnd-wrap .swiper-slide .image img{border-radius: 10px; border: 1px solid #ccc; }
.rnd-wrap .swiper-slide .cont .title{background-color: #001e40; text-align: center;}
.rnd-wrap .swiper-slide .cont .title span{color: #fff; padding: 1.65rem 0; display: inline-block; font-size: clamp(1.8rem, 1.25vw, 4.8rem); font-weight: 600;}
.rnd-wrap .swiper-slide .cont .desc{border: 1px solid #ccc; border-top: 0; text-align: center; padding: 3rem 0.5rem 3.5rem; background-color: #fff;}
.rnd-wrap .swiper-slide .cont .desc p{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); color: #0a0a0a;}


.global-en #brand-info .section-desc{font-size: clamp(1.6rem, 1.145835vw, 3.2rem);}


.brand-row{margin-top: max(4rem, 4.2vw);}
.brand-row .row-item .item-image{margin-left: 0}
.brand-row .row-item .item-image img{width: 100%;}
.brand-row .row-item .item{flex: 1;}
.brand-row .row-item.rtl{margin-top: 0;}
.brand-row .row-item.rtl .item-image{margin-right: 0;}
.brand-row .row-item.rtl .item .cont{padding-left: 0; padding-right: max(4rem, 4.1667vw); text-align: right;}
.brand-row .row-item.rtl .item .cont .btn-wrap{text-align: right;}
.brand-row .row-item .item .cont{display: flex; height: 100%; flex-direction: column; justify-content: center; padding-left: max(4rem, 4.1667vw);}
.brand-row .row-item .item .cont p{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); color: #0a0a0a; margin: 2.5rem 0;}
.brand-row .row-item .item .cont .btn-wrap{text-align: left;}
.brand-row .row-item .item .cont a{color: #727273; display: inline-block; font-weight: 500; font-size: clamp(1.6rem, 0.8275vw, 2.4rem); padding-right: 5rem; box-sizing: border-box; background-image: url('../images/icons/ico-arrow-right.svg'); background-repeat: no-repeat; background-position: right 0 top 4px;}
.brand-row .row-item .item .cont a:hover {animation: aniArrowMove .3s forwards;}
.brand-row .row-item .item .cont p .highlight{color: #143d66; font-weight: 600;}

.brand-row .row-item.lemast .logo img{max-width: 180px;}

.brand-store{margin-top: max(4rem, 5.20834vw);}
.brand-store .swiper-pagination{top: 0; bottom: 0; margin-top: 2rem; position: relative; z-index: 2;}
.brand-store .swiper-pagination-bullet{display: none; width: auto; background-color: transparent; border-radius: 0; height: auto;}
.brand-store .swiper-pagination-bullet-active{display: inline-block;}

/* .brand-slide.brand-store .swiper-slide{width: 58%;} */
.brand-slide.brand-store .swiper-slide .img-box{aspect-ratio: 2;}
.brand-slide.brand-store .swiper-nav button{width: 58px; height: 58px;}

.grid-badge{position: absolute; top: 1rem; left: 1rem; z-index: 1;}
.grid-badge .badge{border-radius: 12px; background-image: linear-gradient(to top, #1e7bbe, #164e86); width: 3rem; height: 3rem; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 14px; font-weight: 600; background: url('../images/products/badge-new.png') no-repeat center/cover;}

.grid-list.row .grid-item{margin-left: 0;}
.grid-list{display: flex; flex-wrap: wrap;}
.grid-list .grid-item{flex: 1;}
.grid-item{position: relative;}
.grid-item .grid-link {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
.grid-item .grid-content {position: relative; }
.grid-item .grid-title {line-height: 1; font-size: clamp(1.8rem, 1.25vw, 3.2rem); font-weight: 600; margin-bottom: 1rem;}
.grid-item .grid-image{margin-bottom: 3rem;}

.grid-item .grid-bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; display: flex; align-items: center; justify-content: center; transition: opacity ease .3s; background-color: rgba(0, 0, 0, 0.4); background-repeat: no-repeat; background-position: center; background-size: 70%;}
.grid-item .grid-bg::before{content: ''; opacity: 0.2; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.grid-item .grid-bg.logo-1{background-image: url('../images/brand/logo-manitsuit-w.png');}
.grid-item .grid-bg.logo-2{background-image: url('../images/brand/logo-lemast-w.png'); background-size: 50%;}
.grid-item .grid-bg.logo-3{background-image: url('../images/brand/logo-takaoka-w.png'); }
.grid-item .grid-bg.logo-4{background-image: url('../images/brand/logo-zen-w.png'); background-size: 40%;}

.brand-list-wrap .grid-item{margin-right: 5%; margin-bottom: 10rem;}
.brand-list-wrap .grid-content{text-align: center;}
.brand-list-wrap .grid-item:nth-child(3n){margin-right: 0;}
.brand-list-wrap .grid-list .grid-item{flex: 0 0 30%;}

.mb-3 .grid-item{margin-bottom: 3rem;}

.grid-image-wrap{width: 100%; margin-bottom: 20px;}

.grid-container{max-width: 900px;}
.grid-list.bg-white .grid-item{border-right: 1px solid #ddd; padding-right: 45px; margin-left: 45px;}
.grid-list.bg-white .grid-image-wrap img{width: 100%;}
.grid-list.bg-white .grid-item:first-child{margin-left: 0;}
.grid-list.bg-white .grid-content{background-color: #fff; border: 1px solid #ddd; padding: 20px 15px 50px 15px;}
.grid-list.bg-white .grid-item:last-child{border-right: 0; padding-right: 0;}
.grid-list.bg-white .grid-title{text-align: left; padding-left: 10px;}

.grid-item:hover .grid-image-wrap img{transform: scale(1.1); }
.grid-item:hover .grid-bg{opacity: 1; }
/* .grid-item .grid-link{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;} */
.grid-item .grid-image-wrap {position: relative; overflow: hidden; margin-bottom: 3rem;}
.grid-item .grid-image-wrap .grid-image{margin-bottom: 0;}
.grid-item .grid-image-wrap:before {content: ""; display: block; padding-bottom: 68.5%;}
.grid-item .grid-image-wrap img{position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; transition: transform .2s;}

.grid-btn{margin-top: 2rem; display: inline-block;}
.grid-category{background-color: #187ef2; border-radius: 4px; color: #fff; display: inline-block; padding: 4px 9px 3px; font-size: clamp(1.2rem, 0.73vw, 1.8rem); margin-bottom: max(1rem, 1.5625vw); text-align: center;}


.row-item{display: flex;}
.row-item .title{font-size: clamp(3.2rem, 2.08334vw, 5.4rem); font-weight: 700; position: relative; line-height: 1;}
.row-item .title::after{content: ''; width: 3rem; height: 2px; background-color: #0a0a0a; position: absolute; bottom: -2.6rem; left: 0;}
.row-item .item-image{margin-left: auto; z-index: 1;}
/* .row-item .item-image img{width: 100%;} */
.row-item .item .desc p{font-size: clamp(1.8rem, 1.25vw, 3.2rem) ; margin-top: max(4.5rem, 2.65vw); letter-spacing: -1px;}
.row-item .item .desc p span{display: inline-block; font-weight: 500;}
.row-item .item .desc p.sub-desc{font-size: clamp(1.6rem, 0.9375vw, 2.4rem); line-height: 1.7;}
.row-item .item .desc p + p{margin-top: 2rem;}
.row-item .item .desc a{margin-top: max(2rem, 2.08334vw);}
.row-item .item .desc div{margin-top: max(2rem, 1.66vw);}

.row-item.rtl{flex-direction: row-reverse; margin-top: max(6rem, 7.292vw);}
.row-item.rtl .item-image{margin-right: auto; margin-left: 0; flex-shrink: 0;}/* max(3rem, 3.125vw) */
.row-item.rtl .item{text-align: right;}
.row-item.rtl .title{ padding-top: 4rem;}
.row-item.rtl .title::after{right: 0; left: auto;}


.page-brand .sub-visual .space{height: 10.417vmax}
.page-brand .sub-visual .desc-wrap .space{height: 5.209vmax;}
.page-brand .sub-visual .desc-wrap .section-title{line-height: 1; font-size: 0;}
.page-brand.manitsuit .section-title img{max-width: max(240px, 15.625vw);}/* 300px */
.page-brand .sub-visual[data-type=pin] .image-wrap .image {--wide: max(4.8rem, 16.6666vw); width: calc(100% - var(--wide, 0)* 2); }

.page-brand.brand-lemast .section-title img{max-width: 180px;}

.global-ja .page-brand.manitsuit .row-item.story .item{width: 55%;}
.global-ja .page-brand.manitsuit .row-item.story .item.item-image{width: 42%;}
.global-ja .row-item .item .desc p{font-size: 1.8rem;}

.global-en .page-brand.manitsuit .row-item.story .item{width: 52%;}
.global-en .page-brand.manitsuit .row-item.story .item.item-image{width: 45%;}
.global-en .row-item .item .desc p{font-size: 1.8rem;}

.text-wrap{margin-top: max(3.5rem, 3.646vw);}

.brand-logo-wrap{padding: 15px 0; opacity: 0.3; background-image: linear-gradient(to top, #ddd, #f0f5fc, #ccc); position: relative; margin-top: -13vw; margin-bottom: 7.6vw; z-index: 0;}
.brand-logo-wrap img{opacity: 0.43;}
.brand-logo-wrap .swiper-slide{font-size: 0;}


.cover-media {display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: 50%; object-position: 50%; max-width: none;}
.brand-slide .swiper-slide .img-box {position: relative; overflow: hidden; width: 100%; display: block; font-size: 0; line-height: 0;  aspect-ratio: 1.641; }
.brand-slide .swiper-slide .img-box > img {position: absolute; top: 0; left: 0; }
.brand-slide .swiper-slide {max-width: 1280px; width: 67.263%; font-size: 0; line-height: 0; }
.brand-slide .swiper-backface-hidden .swiper-slide {transform: translateZ(0); backface-visibility: hidden;}
.brand-slide .swiper-initialized .swiper-wrapper {justify-content: flex-start; }
.brand-slide .swiper-initialized::before, .brand-slide .swiper-initialized::after {content: ""; position: absolute; max-width: 1280px; width: 67.2%; height: 100%; top: 0; left: 50%; transform: translateX(-150%); opacity: 0.4; background-color: #000; z-index: 2;}
.brand-slide .swiper-initialized::after {transform: translateX(50%); }
.brand-slide .swiper-nav{position: absolute; top: 50%; width: 100%; max-width: max(67.2%, 66.667vw) ; z-index: 1; left: 50%; transform: translate(-50%, -50%);}
.brand-slide .swiper-nav .swiper-button-next{right: 0;}
.brand-slide .swiper-nav .swiper-button-prev{left: 0;}
.brand-slide .swiper-nav button{text-indent: -9999px; width: 72px; height: 72px; background-size: cover;}

.store-tabs {display:flex; width:100%; justify-content: center; margin: 0 auto;}
.store-tabs li {flex: 1; margin-left: -1px;}
.store-tabs li a {display: block; text-align: center; height: max(4rem, 2.813vw); line-height: max(4rem, 2.813vw); letter-spacing: 0; border: 1px solid #ccc; font-size: clamp(1.4rem, 0.9375vw, 2.4rem) ; background-color: #f9f9f9;  color: #727273;}
.store-tabs li a:hover{color: #888;}
.store-tabs li a.active{background-color: #08080d; color: #fff;}
.store-tabs li a.active:hover{color:#fff}

.global-ko .store-tabs{max-width: max(80%, 54.167vw); }


.store-wrap{margin-top: max(3rem, 3.14vw);}
.store-wrap ul{position: relative; border-bottom: 1px solid #ccc;}
.store-wrap ul li{display: flex; border-top: 1px solid #ccc; padding: 2.75rem 0; align-items: center;}
.store-wrap ul li .title{padding-left: 6rem; font-size: clamp(1.6rem, 1.25vw, 3.2rem) ; font-weight: 500; width: 46rem; line-height: 1; flex-shrink: 0;}
.store-wrap ul li .cont{margin-left: 18rem; flex-grow: 1;}
.store-wrap ul li .cont p{font-size: clamp(1.4rem, 0.9375vw ,2.4rem); display: flex;}
.store-wrap ul li .cont p + p{margin-top: 1rem;}
.store-wrap ul li .cont p span{display: inline-block;}
.store-wrap ul li .cont p .label{margin-right: 2rem;}
.store-wrap ul li .cont p .icon{margin-top: 3px;}

.brand-overview{position: relative;}
.brand-overview .title{font-size: clamp(3.2rem, 2.08334vw, 5.4rem); font-weight: 600; margin-bottom: max(4.5rem, 2.3438vw); line-height: 1.3;}
.brand-overview .item p{font-size: clamp(1.6rem, 1.25vw, 3.2rem);}
.brand-overview .item p span{color: #004786; font-weight: 500; display: inline-block;}
.brand-overview .btn-dark{background-color: #323233;}
.brand-overview .btn-dark:hover{background-color: #444; border-color: #444;}

.brand-overview.lemast > .item{margin-bottom: max(8rem, 7.8125vw);}
.brand-overview.lemast .desc{padding: 4rem 2rem; background-color: #fff;}
.brand-overview.lemast .desc p{margin-bottom: 3.8rem; }
.brand-overview.lemast .item p span{color: #0a0a0a; display: block}
.brand-overview.lemast .row-item{justify-content: space-between;}
.brand-overview.lemast .row-item .item{ position: relative; z-index: 2; flex: 1;}
.brand-overview.lemast .row-item .item img{width: 100%;}
.brand-overview.lemast .row-item .item:last-child{margin-right: 6.25vw;}
.brand-overview.lemast .text-deco{position: absolute; top: 50%; left: -14vw; width: 100%; z-index: 3;}

.global-ja .brand-overview.lemast .desc p{font-size: clamp(1.6rem, 1.0417vw, 2.8rem);}

.bg-section-le{background-color: #26282c; position: relative; z-index: 1; }
.bg-section-le .brand-overview.lemast .row-item{margin-top: 0;}
.bg-section-le .brand-overview.lemast .row-item .item.img1{margin-top: max(-40rem, -18.2292vw);}
.bg-section-le .brand-overview.lemast > .item{margin-bottom: 0; margin-top: max(5rem, 5.20834vw);}
.bg-section-le .brand-overview.lemast .title{color: #fff;}
.bg-section-le .brand-overview.lemast .desc p{margin-bottom: 0;}

.global-ja .bg-section-le .brand-overview.lemast .desc p{text-align: center;}


.brand-overview.takaoka .title{color: #a99768;}
.brand-overview.takaoka .row-item{justify-content: space-between;}
.brand-overview.takaoka .row-item .item{margin-bottom: 6rem;}
.brand-overview.takaoka .row-item .item:nth-child(2n){margin: 0 4rem;}
.brand-overview.takaoka .desc p{color: #ccc; font-size: clamp(1.6rem, 1.25vw, 3.2rem); margin-bottom: max(3rem, 2.72vw);}

.bg-takaoka{background: #e8e8e8 url('../images/brand/bg-takaoka.jpg') no-repeat center/cover;}

.row-concept{margin-top: max(6rem, 6.25vw); display: flex; position: relative;}
.row-concept .image{flex-shrink: 0;}
.row-concept .cont{margin-left: 2rem; flex-grow: 1; position: relative; padding: 4rem; border-radius: 10px;}
.row-concept .cont::before{position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; background-color: rgba(255, 255, 255, .1); border-radius: 10px;}
.row-concept .cont .title{font-size: clamp(3.2rem, 2.08334vw, 5.4rem); font-weight: 600; line-height: 1; margin-bottom: max(2.4rem, 1.8vw); position: relative;}
.row-concept .cont .desc{font-size: clamp(1.8rem, 1.25vw, 3.2rem); color: #ccc; position: relative;}

.bg-takaoka2{background-color: #dedbd3;}

.bg-takaoka2 .row-item{justify-content: space-between;}
.bg-takaoka2 .row-item .item{margin-top: 5rem; flex: 1;}
.bg-takaoka2 .row-item .item img{width: 100%;}
.bg-takaoka2 .row-item .item:first-child{margin-top: -28rem; margin-right: 6.25vw;}


.bg-zen{background-color: #f0f5fc;}
.brand-overview.zen .row-item{justify-content: space-between; margin-top: max(5rem, 5.25vw);}
.brand-overview.zen .row-item .item strong{font-weight: 500;}
.brand-overview.zen .row-item .item .desc p{font-size: clamp(1.6rem, 1.25vw, 3.2rem);}


.global-ja .brand-overview.zen .row-item .item .desc p{font-size: clamp(1.6rem, 1.04167vw, 2.8rem);}
.global-ja .brand-overview.zen .row-item.story .item{width: 50%;}
.global-ja .brand-overview.zen .row-item.story .item-image{width: 48%;}
.global-ja .brand-overview.takaoka .desc p{font-size: clamp(1.6rem, 1.197915vw, 3.2rem); }
.global-ja .brand-overview.takaoka .row-concept .image{width: 28%;}
.global-ja .brand-overview.takaoka .row-concept .cont{padding: 4rem 2rem;}

.global-en .brand-overview.zen .row-item .item .desc p{font-size: clamp(1.6rem, 1.04167vw, 2.8rem);}
.global-en .brand-overview.zen .row-item.story .item{width: 50%;}
.global-en .brand-overview.zen .row-item.story .item-image{width: 48%;}

.grid-list-wrap .grid-item{margin-bottom: 10rem;}

.dist-wrap .item .image{margin-bottom: 1.8rem;}
.dist-wrap .item .image img{width: 100%;}
.dist-wrap .item p{font-size: clamp(1.6rem, 0.9375vw, 2.4rem);}

.global-ja .dist-wrap .item p{font-size: 1.6rem;}

/**********
* ## CAREERS
**********/
.page-careers .basic-section .section-header .section-desc{margin-top: 1.5rem;}
.person-wrap .image{margin-bottom: 10rem;}
.person-wrap ul{display: flex; justify-content: space-between;}
.person-wrap ul li{flex: 1; text-align: center; position: relative;}
.person-wrap ul li h5{font-size: 4rem; margin-bottom: 1rem; line-height: 1; font-weight: normal;}
.person-wrap ul li p{font-size: 1.8rem; line-height: 1.6;}
.person-wrap ul li::after{content: ''; right: 0; width: 1px; height: 100%; position: absolute; top: 0; background-color: #ccc;}
.person-wrap ul li::before{content: ''; width: 10px; height: 10px; position: absolute; top: -3rem; left: 50%; background-color: #18cc7b; border-radius: 50%; margin-left: -5px;}
.person-wrap ul li:nth-child(2)::before{background-color: #ff8d24}
.person-wrap ul li:nth-child(3)::before{background-color: #187ef2}
.person-wrap ul li:last-child::after{display: none;}
.person-wrap .desc{border-radius: 30px; border: 1px solid #143d66; text-align: center; margin-top: 10rem;}
.person-wrap .desc p{padding: 1rem 0; font-size: 2.4rem; color: #143d66;}

.global-en .person-wrap .desc{border-radius: 50px;}
.global-en .page-careers .basic-section .section-header .section-desc{font-size: clamp(1.6rem, 1.0417vw, 2.4rem);}

.how-to-apply-wrap .image{margin-bottom: 4rem;}
.how-to-apply-wrap .image img{width: 100%;}
.how-to-apply-wrap ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.how-to-apply-wrap ul li{position: relative; margin-top: 6rem; flex: 1; padding-left: 4rem;}
.how-to-apply-wrap ul li:first-child{padding-left: 0;}
.how-to-apply-wrap ul li h5{font-size: 2.4rem; text-align: center; line-height: 1.8;}
.how-to-apply-wrap ul li h5 span{text-decoration: underline; display: block;}
/* .how-to-apply-wrap ul li .item{width: max(29rem, 15.1vw);} */
.how-to-apply-wrap ul li .box{border-radius: 4vw; height: 8.334vw; width: 100%; margin: 0 auto 2rem; display: flex; align-items: center; justify-content: center; background-color: #f0f5fc; position: relative;}/* 9.375vw */
.how-to-apply-wrap ul li .box:after{content: ''; position: absolute; right: -13.5%; top: 50%; background: url('../images/careers/arrow-03.png') no-repeat center/cover; width: 32px; height: 16px; background-position: right;}
.how-to-apply-wrap ul li:last-child .box:after{display: none;}
/* .how-to-apply-wrap ul li:nth-child(4) .box:before{content: ''; position: absolute; left: -10%; top: 50%; background: url('../images/careers/arrow-03.png') no-repeat center/cover; width: 65px; height: 16px;} */
.how-to-apply-wrap ul li p{text-align: center;}
.how-to-apply-wrap ul li:nth-child(3) p{letter-spacing: -0.5px;}
.how-to-apply-wrap ul li:nth-child(4) .box::after{display: none;}

.how-to-apply-wrap ul li:last-child .box{background-color: #003bb3;}
.how-to-apply-wrap ul li:last-child .box h5{color: #fff;}
.how-to-apply-wrap ul li:last-child .box h5 span{text-decoration: none;}

.global-ja .how-to-apply-wrap ul li{width: 50%; flex: none; padding: 0 1.5rem;}
.global-ja .how-to-apply-wrap ul li:first-child{padding-left: 1.5rem;}
.global-ja .how-to-apply-wrap ul li .box:after{display: none;}
/* .global-ja .how-to-apply-wrap ul li{} */


/**********
* ## Contact
**********/
.contact-form{position: relative; max-width: 98rem; margin-top: 10rem;}
.contact-form .radio-box{display: inline-flex;}
.contact-form .radio-input{max-width: 81%;}
.contact-form .radio-box-wrap{border: 1px solid #d0d0d0; padding: 0.5rem 1rem; margin-right: 1rem; flex: 0 0 33.33%;}

.contact-form .form-input{margin-bottom: 6rem;}
.contact-form .input{border: 0; border-bottom: 1px solid #0a0a0a; background-color: #fff;}
.contact-form .label{font-size: 1.8rem; margin-bottom: 2.8rem; display: block; font-weight: 600;}
.contact-form .label .icon{margin-left: 10px;}
.contact-form textarea.input{border: 1px solid #0a0a0a; min-height: 40rem; line-height: 1.35; padding: 5px;}
.contact-form .input.border{border: 1px solid #d0d0d0; background-color: #f5f5f5; width: 10rem; padding-left: 1rem;}
.contact-form .select-box{border-top: 0; border-left: 0; border-right: 0; border-bottom-color: #000; border-radius: 0;}
.contact-form .select-box .btn-select{height: 4.8rem; line-height: 4.8rem; }
.contact-form .select-box .select-list a{line-height: 1; padding: 8px 5px;}

.contact-form .btn{padding: 12.65px 10px;}

.contact-errors{position: absolute; right: -280px; top: 0; font-size: 12px; }
.contact-errors .alert{padding: 10px; margin-bottom: 5px;}

.check-container{display: flex; justify-content: space-between;}
.check-container .check-box.icon label::before{top: 2px}
.check-container .check-box.icon label::after{top: 2px;}
.check-container .check-box.icon input[type="checkbox"]:checked + label::after {top: 2px}

.check-container strong{color: #065ab9; display: inline-block;}
.check-container .text{font-size: 14px; color: #666; margin-left: 10px;}
.check-container .more a{color: #000; font-size: 14px; text-decoration: underline;}

.btn-submit{background-color: #2e3033; color: #fff; display: inline-block; padding: 1.6rem 11.89rem; font-size: 1.8rem; font-weight: 600; line-height: 1;}


.row-cert{display: none;}
.error-cert-check{display: inline-block;}

.contact-top{display: flex; margin-bottom: 3rem; align-items: center;}
.contact-top .contact-title{font-size: 1.2rem; font-weight: 600;}
.contact-top .label-req{margin-left: 1.5rem; color: #000; padding-right: 0;}
.contact-top .label-req .ico-check{margin-right: 5px}


.section-map{background-color: #2e3033;}

.contact-container{display: flex;}
.contact-container .map-wrap{flex-shrink: 1; flex: 1;}
.contact-container .address-info{flex-grow: 0; background-color: #fff; padding: 4rem 2rem; width: 40rem; height: 40rem;}
.contact-container .address-info .line{width: 30px; height: 3px; background-color: #121212; margin-bottom: 2rem;}
.contact-container .address-info .form-group{margin-bottom: 4rem;}
.contact-container .address-info p{display: flex; align-items: center; font-size: 1.8rem;}
.contact-container .address-info p .icon{margin-right: 1rem; flex-shrink: 0;}
.contact-container .address-info p .text{flex-grow: 1;}
.contact-container .address-info p + p{margin-top: 5px;}


/**********
* ## Form
**********/
.form-table {table-layout: fixed; }
.form-table th, .form-table td {padding: 1rem 0; position: relative; border-bottom: 1px solid #ccc;}
.form-table th {width: 20%; font-weight: 500; text-align: left; padding-left: 1rem; line-height: 1; background-color: #f0f0f0; color: #111;}
.form-table th label{vertical-align: middle;}
.form-table td {width: 80%; padding-left: 2rem;}

.form-table th em {font-size: 14px; margin-left: 11px;}
.req {position: relative;}
.req::after {content: "*"; padding-left: 5px; color: #fe0000;}


.form-table .select-box{display: inline-block; vertical-align: middle;}
.form-table .select-box + a{display: inline-block; margin-left: 10px; font-size: 13px; min-width: auto;}

/* .bg_gray .form-table .dx-input, .bg_gray .form-table .select-box .btn-select {background-color: #f8f8f8; } */

.phone-input {position: relative; display: flex; align-items: center; justify-content: space-between;}
.phone-input + a {display: inline-block; vertical-align: middle; margin-left: 10px;}
.phone-input .select-box {width: 30%;}
.phone-input .unit {width: 5%; height: 40px; line-height: 40px; text-align: center; font-size: 14px; color: #666;}
.phone-input .input {width: 30%;}

.form-table .name-input {position: relative; width: 100%; display: inline-block; vertical-align: middle;}

.form-table .product-input{display: flex; width: 60%;}
.form-table .product-input .dx-input{width: 70%;}
.form-table .product-input .select-box{margin-left: 1%;}

.email-input {position: relative; display: flex;}
.email-input .inputs{width: 70%; display: flex;}
.email-input .input {width: 42.858%;}
.email-input .unit {width: 7.143%; height: 40px; line-height: 40px; text-align: center; font-size: 14px; color: #666;}
.email-input .select-box {position: absolute; right: 0; top:0; width: 30%;}

.address-input .addr-line{margin-bottom: 1rem;}

.form-table .num-input {position: relative; width: 50%; display: inline-block; vertical-align: middle;}
.form-table .num-input .dx-input {width: 35%;}
.form-table .num-input a {display: inline-block; margin-left: 10px;}
.form-table .num-input .time {font-size: 14px; font-weight: 500; color: #fe0000; margin-left: 10px; display: inline-block;}

.form-table .time-input{position: relative; display: inline-block; width: 100%;}
.form-table .time-input .select-box{float: left; width: 20%;}
.form-table .time-input .unit {float: left; width: 4%; height: 40px; line-height: 40px; text-align: center; font-size: 14px; color: #666;}

.form-table .marker-input{position: relative; width: 58%; display: inline-block; vertical-align: middle;}
.form-table .marker-input .dx-input {width: 76%;}
.form-table .marker-input a {display: inline-block; margin-left: 10px;}
.dx-input.search{background:url("../images/icons/search.png") no-repeat center right; background-size: 15px auto; }


.contact-form .form-group.lg{margin-top: 20px;}

.form-btn {display: flex; margin-top: 6rem; }
.form-btn .btn{font-weight: 600; padding: 0; width: 20rem; height: 5rem; line-height: 5rem; border-radius: 2.5rem;}
.form-btn a.btn{padding: 18px 20px 14px;}
.form-btn .btn + .btn{margin-left: 10px;}
.form-btn .sp-submit + .sp-submit{margin-left: 1rem;}
.btn-line{border: 1px solid #333; width: auto; min-width: auto; font-size: 13px;}
.btn-line:hover{color: #ccc; }

/* .form-table td .error-place{bottom: 5px;} */

.form-table .help-desc{margin-top: 10px;}
.form-table-footer{margin-top: 1rem;}
.form-table-footer .check-box a{text-decoration: underline; color: #0e9bf5;}
/* .form-table-footer .check-box label::before, .form-table-footer .check-box label::after{top: 1px;} */
/* .form-table-footer .check-box input[type="checkbox"]:checked + label::after{top: 4px;} */


.bs-number-input{display: inline-block; width: 60%;}
.bs-number-input .bno1{width: 80px;}
.bs-number-input .bno2{width: 50px;}
.bs-number-input .bno3{width: 100px;}

.bs-number-container{display: flex;}
.bs-number-container input.n1{width: 29%; margin-right: 1%;}
.bs-number-container input.n2{width: 24%; margin-right: 1%;}
.bs-number-container input.n3{width: 45%;}


/**********
* ## SUPPORT
**********/

/**********
* ####  QNA
**********/

.page-support .info-box{margin-top: 3rem; }
.info-box{display: flex; align-items: center; padding: 1rem 1.5rem; background-color: #f0f0f0; margin-bottom: 3rem;}
.info-icon{width: 75px; margin-right: 1rem; flex-shrink: 1;}
.info-icon img{max-width: 75px;}
.info-text{flex-grow: 0; color: #000;}
.info-text .info-title{font-size: 1.2rem; font-weight: 600;}

#fqnaform .btn-wrap{margin-top: 5rem; margin-bottom: 2.5rem;}



/* NOTICE */
.check-border{position: relative; display: inline-block; line-height: 1.25; font-size: 15px;}
.check-border input[type=checkbox]{opacity: 0; position: absolute; top: 0; left: 0; z-index: 0;}
.check-border label{display: inline; cursor: pointer; text-align: center;  line-height: 1em; font-weight: normal; font-size: 14px; padding: 5px 10px; border: 1px solid transparent; color: #233b4d;}
.check-border input[type="checkbox"]:checked + label{color: #ecb10d; border-radius: 15px; border: 1px solid #ecb10d; font-weight: 500;}


.list-empty{height: calc(100vh - 100px); background: #f2f2f2; text-align: center;}
.list-empty:after {content: ''; display: inline-block; height: 100%; vertical-align: middle;}
.list-empty .text {display: inline-block; vertical-align: middle; font-size: 15px; color: #b8bfc4;}


/**********
* ## Terms
**********/
.privacy-wrap {color:#666; line-height:1.6em; display:block;  clear:both; min-height:600px}
.privacy-wrap .privacy-box {padding:30px 0;}
.privacy-wrap .privacy-box:last-child {padding-bottom: 0;}
.privacy-wrap .privacy-box.summary {padding:30px; background:#f8f8f8; margin-bottom:20px}
.privacy-wrap .privacy-box.summary p {color:#333;}
.privacy-wrap .privacy-box.summary span.desc {font-size:13px; color:#999}
.privacy-wrap .privacy-box.summary p + p {margin-top:20px}
.privacy-box h4{margin: 15px 0 5px; color: #000; font-weight: 500;}
.terms .privacy-box h4{margin-top: 60px;}
.terms .privacy-box h4:first-child{margin-top: 0;}

.privacy-box.summary .list-style-box {display: table; width: 100%; table-layout: fixed; vertical-align: top;}
.privacy-box.summary .list-style {display: table-cell; width: 50%;}
.privacy-box.summary .list-style li{padding: 2px 0;}

.privacy-wrap .privacy-box .privacy-title { font-weight: 700;  color:#333; font-size:18px;}
.privacy-wrap .privacy-box  p + p,
.privacy-wrap .privacy-box  div + p,
.privacy-wrap .privacy-box  p + div,
.privacy-wrap .privacy-box  div + div{margin-top:10px;}
.privacy-wrap .privacy-listbox {padding:20px; border:1px solid #d5d5d5}
.privacy-wrap .privacy-listbox p {line-height: 1.4em}
.privacy-wrap .privacy-listbox p + p,

.list-style-box .list-style{position: relative; padding-left: 20px; font-size: 15px; color: #666; line-height: 1.4em;}


/**********
* ## FAQ
**********/
.faq-wrap { margin:0 auto; }
.faq-wrap ul.faq li.faq-item { border-bottom:1px solid #d0d0d0; overflow:hidden; color:#000; font-size:16px; }
.faq-wrap ul.faq li.faq-item a.faq-title { color:#000; padding: 1rem 0 1rem 1rem; display:block; position: relative; overflow: hidden;}
.faq-wrap ul.faq li.faq-item a.faq-title:hover { background-color: #f0f5fe;}
.faq-wrap ul.faq li.faq-item a.faq-title.active:hover { background-color: #fff;}
.faq-wrap ul.faq li.faq-item a.faq-title span { vertical-align:middle; display:inline-block}
.faq-wrap ul.faq li.faq-item a.faq-title span.faq-label {float: left;}
.faq-wrap ul.faq li.faq-item a.faq-title span.subject {width:90%; font-size:18px; float: left;}	
.faq-wrap ul.faq li.faq-item a.faq-title span.arrow { text-indent: -9999px; background: url("../images/icons/ico-angle-down.png") center no-repeat; width:20px; height:12px; opacity: 0.3; position:absolute;top: 50%;  margin-top: -7px; right:20px; transition: all ease 0.2s;}
.faq-wrap ul.faq li.faq-item a.active .arrow { -webkit-transform:rotate(180deg); color:#333}
.faq-wrap ul.faq li.faq-item .answer {display:none; background-color:#f0f0f0; padding: 1.2rem 1rem 2rem 1rem; overflow: hidden;}
/* .faq-wrap ul.faq li.faq-item .answer .label-a {float: left;} */
.faq-wrap ul.faq li.faq-item .answer .answer-content {width: 90%;}
.faq-wrap ul.faq li.faq-item .faq-label {display:inline-block; color: #000; margin-right: 0.5rem; font-weight: 700; width: 18px; text-align: center; font-size: 0.9rem; font-family: 'Play', sans-serif }
.faq-wrap .btn-wrap {margin-top:20px; text-align: center}



/**********
* ## MYPAGE
**********/
.mypage-container{background-color: #fff; min-height: 500px; padding-bottom: 40px;}
.mypage-list{position: relative;}
.mypage-list li{border-bottom: 1px solid #e5e5e5; font-weight: 500;}
.mypage-list li:hover{background-color: #f0f5fe;}
.mypage-list li.my-store:hover{background-color: transparent;}
.mypage-list li a{display: block; padding: 27px 0 27px 30px; width: 100%;  background: url('../images/icons/arrow_next.png') no-repeat 98% 50%;}

.mypage-header{background-color: #fff; padding: 30px; border-bottom: 2px solid #1a1a1a;}
.mypage-header h3{font-size: 17px; color: #1a1a1a; margin-bottom: 5px;}

.mypage-content{padding: 30px; background-color: #fff; min-height: 600px;}
.mypage-content .contact-form{width: 100%; max-width: 100%;}
.mypage-content .form-btn{align-items: center; justify-content: center;}


.qna-list li{border: 1px solid #d0d0d0; background-color: #f5f5f5; padding: 1rem;}
.qna-list li .title{font-size: 0.9rem; color: #000; font-weight: 600; margin-bottom: 10px;}
.qna-list li p{color: #000;}

/* .product-input{position: relative; overflow: hidden;}
.product-input .input-wrap{width: 80%; float: left; overflow: hidden;}
.product-input .dx-input{width: 40%; border: 1px solid #ccc; height: 35px; padding: 0 5px; float: left;}
.product-input .dx-input:first-child{width: 58%; margin-right: 2%;}
.product-input button{width: 18%; margin-left: 2%; min-width: auto; float: left;} */


.file-input{position: relative; overflow: hidden;}
.file-input .dx-input{float: left; width: 80%;}
.file-input button{float: left; width: 18%; margin-left: 2%; min-width: auto;}

.input-inner{margin-bottom: 10px;}

#resultFile{display: flex; flex-wrap: wrap; box-sizing: border-box; margin: 0 -10px 20px -10px;}
.file-item{flex: 0 0 25%; padding: 10px; position: relative;}
.file-item .file-image{background-position: center; background-size: cover; background-repeat: no-repeat; width: 140px; height: 140px; display: inline-block;}
.file-item .icon-ga-main{position: absolute; top: 10px; max-width: 140px; width: 100%; height: 30px; background-color: rgba(0,0,0,0.5); font-size: 13px; color: #fff; line-height: 30px; text-align: center;}
.file-item p{text-align: center;}


.btn-tabs{margin-bottom: 30px; text-align: center;}
.btn-tabs a + a{margin-left: 10px;}
.btn-tabs a.active{background-color: #2c353c; color: #fff; border-color: #2c353c;}


.social-login-button .social-login{border: 1px solid #d0d0d0; padding: 10px 2rem;}
.social-login-button{margin-right: 1rem;}
 
/**********
* ## BOARD
**********/
.bbs-wrap {min-height: 600px;}

.bbs-top {position: relative; padding: 0.5rem 0; display: flex; align-items: center;}
.bbs-top .top-left {color:#333; font-weight: 400; font-size: 1.4rem;}
.bbs-top .top-right {margin-left: auto;}
/* .bbs-top .top-right a{ line-height: 1;} */
.bbs-top .top-right a+a{margin-left: 5px; border-left: 1px solid #ddd; padding-left: 8px;}
.bbs-top .top-right ul.search-wrap > li { display:inline-block; vertical-align: middle; position:relative}


.search-status{margin-top: 3px;}
.status-label{color: #000; margin-right: 10px; display: inline-block; font-weight: 500;}
.search-status label{margin: 0 5px; }

.bbs-top .top-right ul.search-wrap > li + li::before { content: ""; width:1px; height: 20px; background:#ccc; position: absolute; top:50%; margin-top:-10px; left: -1px}
.bbs-top .top-right ul.search-wrap > li input[type=text] {border:0; padding:10px 0 10px 5px; width:250px; color:#333; border-bottom: 1px solid #5e5e5e;}
.bbs-top .top-right ul.search-wrap > li .btn-search{width:20px;height:20px;background:url("../images/icons/ico_search.png") no-repeat center center; display: block; position:absolute; top:50%; margin-top:-10px;right:0; background-size: 15px auto; }
.bbs-top .top-right ul.search-wrap .select-box  {width:100px; border: 0;}
.bbs-top .top-right ul.search-wrap .select-box .btn-select {padding-right: 30px; height: 33px;line-height: 33px; color: #000;}
.bbs-top .top-right ul.search-wrap .all-view{margin-right: 10px;}
.bbs-top .top-right .btn-write{margin-left: 20px;}

.search-order{text-align: right; margin-bottom: 20px; line-height: 1;}
.search-order .select-box{width: auto; display: inline-block;}
.search-order .select-box .btn-select{height: 33px; line-height: 33px; font-size: 14px; color: #000;}
.search-order .select-box .select-list li a{font-size: 14px;}

.search-category{padding: 20px 0 30px; margin-bottom: 30px; text-align: center; border: 1px solid #d5d5d5;}
.search-category .select-box{display: inline-block; width: 200px; vertical-align: middle;}
.search-category .select-box + .select-box{margin-left: 15px;}


.bbs-tab-wrap{position:relative; margin: 0 0 6rem;}
.bbs-tab {display: flex; justify-content: center; align-items: center;}
.bbs-tab li {position: relative; margin-right: 2rem;}
.bbs-tab li:last-child {margin-right:0; }
.bbs-tab li a {display:inline-block;  -webkit-transition: color 0.3s;transition: color 0.3s; text-align: center; text-align: center; border: 1px solid #f5f7f9; background-color: #f5f7f9; color: #5e5e5e; padding: 4px 10px;}
.bbs-tab li.active a{ font-weight: 500; border-color: #065ab9; background-color: #fff; color: #065ab9;}
.bbs-tab li a:hover{border-color: #96979e;}


.bbs-table { min-height:300px;}
.bbs-wrap .bbs-table {min-height:auto;}
.bbs-table .line { display:block; width:100%; height:1px; background:#ececec; margin:20px auto}
.bbs-table .tit { color:#666}
.bbs-table table{table-layout: fixed;}
.bbs-table table thead th { position: relative; font-weight:500}
.bbs-table table tbody td.ft-s { font-size:13px; color:#333}
.bbs-table table thead td span.icon { font-size:9px; opacity: 0.5; margin-left:5px; vertical-align: middle;padding-bottom: 3px}
.bbs-table table tbody tr:hover { background-color: #f9f9f9;}
.bbs-table table tbody td { position: relative;; }
.bbs-table table tbody td.date { color:#999}
.bbs-table table tbody td .state { color:#f42534}
.bbs-table table tbody td .state.end { color:#999}
.bbs-table table td { border-bottom:1px solid #d1d1d1;color:#000; padding:15px 20px;/* text-align:center*/}
.bbs-table table thead th {padding:20px 0; border-bottom:1px solid #666;}
.bbs-table table td.subject { text-align:left; }
.bbs-table table td.subject .category {font-size: 14px; vertical-align: middle; background-color: #F0EDFF; border-radius: 5px; width: 40px; height: 24px; line-height: 24px; display: inline-block; text-align: center; font-weight: 500; margin-right: 5px;}
.bbs-table table td.subject .category.key-1 { color: #6841ff;}
.bbs-table table td.subject .category.key-2 { color: #61cdc9;}
.bbs-table table td a { color:#000;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display: inline-block;max-width: 95%;vertical-align: middle;}
.bbs-table table td a:hover {text-decoration: underline;}
.bbs-table table td.last-btn a.btn span { text-decoration: underline;}
.bbs-table table td.last-btn span {font-size: 13px;}
.bbs-table table td .bbs-col {font-size: 13px; color: #777; display: inline-block; position: relative; padding-right: 10px; margin-right: 5px;}
.bbs-table table td .bbs-col:first-child::after {position: absolute; content: ''; top: 4px; right: 0; width: 1px; height: 10px; background-color: #777;}

.bbs-table table tr.noti td { background:#f8f8f8; font-weight: 500;}
.bbs-table table tr.noti td:first-child {color:#f42534}
.bbs-table table tr.cancel td,
.bbs-table table tr.cancel td a,
.bbs-table table tr.cancel td a:hover { color:#999!important; cursor:default; text-decoration: none;}

.bbs-table table td.bd_r { border-right:1px solid #ececec}
.bbs-table table td.bd_l { border-left:1px solid #ececec}
.bbs-table table td.info_left { text-align:left; padding:0 20px}
.bbs-table table tbody td.date { font-size: 13px; color: #666; letter-spacing: -0.5px; font-weight: normal;}
.bbs-table .type-box { position:relative; display:inline-block; top:0; left:0; font-size:12px; padding:0}
.bbs-table .type-box.end{background:#666666; border-color:#666666}
.bbs-table .type-box.ing{background:#f42534 ; border-color:#f42534 ;}

.bbs-btn {margin:40px auto 0; text-align: center}
.bbs-btn a {min-width:200px;}
.bbs-btn a span {font-weight:500; color:#333}
.bbs-btn a span.total { opacity: 0.6}
.bbs-btn .btn-line{border: 1px solid #a7a8a9; height: 50px; line-height: 47px; color: #333; display: inline-block; text-align: center; font-size: clamp(1.6rem, 0.9375vw, 2.4rem);}
.bbs-btn .btn-line + .btn-line{margin-left: 10px;}
.bbs-btn .btn-line.btn-success span{color: #fff;}
.bbs-btn .btn-line.btn-primary span{color: #fff;}

.bbs-list-search{margin-top: 40px;}
.bbs-list-search .search-wrap{display: flex; align-items: center; justify-content: center;}
.bbs-list-search .search-wrap li{flex-direction: row; position: relative;}
.bbs-list-search .search-wrap li .select-box{width: 120px; border: 0; margin-right: 20px; padding-right: 10px;}
.bbs-list-search .search-wrap li .select-box::after{position: absolute; top: 11px; right: 0; width: 1px; height: 15px; background: #121212; content: '';}
.bbs-list-search .search-wrap li input[type=text]{border: 0; height: 38px; width: auto;}
.bbs-list-search .search-wrap li input[type=text]::placeholder{text-decoration: underline;}
.bbs-list-search .search-wrap li .btn-search{ background: url('../images/icons/ico_search.png') no-repeat center/cover; width: 16px; height: 16px; margin-top: -5px;}

.bbs-list-footer{overflow: hidden; margin-top: 40px;}
.bbs-list-footer .btn{padding: 7px 12px;}


.empty-wrap {  padding:100px 0 66px; margin:0 auto; text-align:center; }
.empty-wrap .icon { margin-bottom:10px;}
.empty-wrap p { color:#666; font-size: 18px; font-weight: 500; letter-spacing:-0.5px;}
.empty-wrap p span {color:#666}

.empty-wrap .btn-wrap { text-align:center}
.empty-wrap .btn-wrap a {min-width:100px}
.empty-wrap .btn-wrap a + a { margin-left:4px}

.empty-post{padding: 50px 0 !important; text-align: center;}


.bbs-new { display: inline-block;background:#fe0000; width:5px;height:5px; border-radius: 5px; font-weight: 700; margin-left: 3px;vertical-align:middle; position: relative;top:-5px}
.bbs-new + a {vertical-align:middle}

.bbs-icon{display: inline-block; background: #f2f2f2; width: 15px; height: 15px; line-height: 15px; font-size: 13px; text-align: center; vertical-align: text-bottom; margin-left: 3px;}
.bbs-icon.download{background-image: url('../images/icons/ico_file.png'); width: 16px; height: 16px; }



.bbs-gallery{padding-top: 2rem;}
.bbs-gallery .grid-item{margin-left: 0; margin-bottom: 5rem;}
.bbs-gallery.type-01 .grid-list{border-top: 1px solid #727273; margin: 0; display: block;}
.bbs-gallery.type-01 .grid-item{margin-bottom: 1rem; padding-bottom: 2rem; padding-top: 2rem; border-bottom: 1px solid #727273;}
.bbs-gallery.type-01 .grid-item a{display: flex; }
.bbs-gallery.type-01 .grid-item .grid-image{flex-shrink: 0; width: 38rem;}
.bbs-gallery.type-01 .grid-item .grid-image img{width: 100%;}
.bbs-gallery.type-01 .grid-item .grid-content{flex-grow: 1; text-align: left; margin-left: max(3rem, 5.209vmax);}
.bbs-gallery.type-01 .grid-item .grid-title{text-align: left;  margin-bottom: max(1.5rem, 1.5vw); line-height: 1.4;}
.bbs-gallery.type-01 .grid-item .grid-desc{font-size: clamp(1.6rem, 0.9375vw, 2.4rem);}
.bbs-gallery.type-01 .grid-item .grid-desc + .grid-desc{margin-top: max(1.5rem, 1.5vw);}
.grid-date{font-family: 'Spoqa Han Sans Neo', sans-serif;}
.bbs-gallery.type-01 .grid-item .grid-image{margin-bottom: 0;}


.bbs-card{position: relative;}
.bbs-card .grid-list .grid-item{border: 1px solid #d0d0d0; padding: 10px; display: flex; margin-bottom: 3rem; height: 17.8rem;}
.bbs-card .grid-list .grid-item .grid-image{flex-shrink: 0; max-width: 12rem; margin-right: 2rem;}/*  */
.bbs-card .grid-list .grid-item .grid-image img{width: auto; max-width: 100%;}/* margin-right: 2rem; */
.bbs-card .grid-list .grid-item .grid-content{flex-grow: 1;}
.bbs-card .grid-item .grid-title{color: #121212; font-weight: 600; font-size: 1.8rem; text-align: left;}
.bbs-card .grid-item .grid-desc{color: #121212; font-size: 1.5rem;}
.bbs-card .grid-item .line{width: 30px; height: 3px; background-color: #121212; margin: 2rem 0;}

.page-contact .bbs-wrap .bbs-tab-wrap{margin-bottom: 4rem;}
.page-contact .bbs-wrap .bbs-tab li{margin-right: 1rem;}
.page-contact .bbs-wrap .bbs-tab li a{width: 12rem; }

/**********
* ## Board view
**********/
.bbs_btn { text-align:center; margin:20px auto 0} 
table.bbs-view { width:100%;table-layout:fixed; word-break:break-all; border-top:2px solid #777}
table.bbs-view td { border-bottom:1px solid #ccc; padding:20px 0;}
table.bbs-view td img {  max-width:100%}
table.bbs-view td.date { text-align:right}
table.bbs-view td.subject {text-align:left;}
table.bbs-view td.subject .detail-header { padding:15px 30px; font-size: 14px; color: #666; letter-spacing: -0.5px; position: relative;}
table.bbs-view td.subject .detail-header .info{background: none; margin-right: 10px;}
table.bbs-view td.subject .detail-header .info em{color: #333; padding-right: 3px;}

table.bbs-view td.subject .detail-header .label-type { position:absolute; top:50%; margin-top:-13px;right:30px}
.label-type.end {background-color: #999;}
.label-type span {background: #f42534; display: inline-block; padding: 8px 10px; color: #fff; font-size: 13px; line-height: 1em;}

table.bbs-view td.subject .detail-header p.hd-cate {color:#333; margin-bottom:10px; font-weight: 500; font-size: 15px}
table.bbs-view td.subject .detail-header p.hd-tit {color:#333; font-size:34px; padding-bottom:15px;letter-spacing:-1px; font-weight: 500; line-height: 1.3em; }
table.bbs-view td.subject .detail-header p.hd-tit span + span { margin-left:10px}
table.bbs-view td.subject .detail-header p .type { padding-right:10px; margin-right:15px; border-right:1px solid #d9d9d9}
table.bbs-view td.subject a{ color:#333}
table.bbs-view td.subject a:hover { color:#333; text-decoration:underline}
table.bbs-view td.subject p.date {display:none; color:#777; margin-top:4px; clear:both; }

table.bbs-view td.subject ul li { font-size:14px; color:#666; float:left; padding:10px;}
table.bbs-view td.subject ul li:first-child { padding-left:0}
table.bbs-view td.subject ul li.dot { padding:10px 0}

table.bbs-view thead td { padding:16px 0}
table.bbs-view tbody td { border-bottom:0}
table.bbs-view tbody td.contents { text-align:left; padding:30px; line-height:1.8em; word-break:break-word; overflow:hidden}
table.bbs-view tbody td.contents #player {margin:0 auto 30px; display:block;}
table.bbs-view tbody td.contents p {word-break:break-word; line-height: 1.4;}
table.bbs-view tbody td.contents strong{font-weight: 500;}
#post-content{min-height: 300px;}
#post-content iframe{max-width: 960px; width: 100%; height: 56vh;}

table.bbs-view tbody td.contents img { max-width:100%}

table.bbs-view tbody td.contents.btn-wrap { text-align:center}
table.bbs-view tbody td.file-wrap { border-bottom:1px solid #eee; padding:20px 30px 20px; text-align: left}
table.bbs-view tbody td.file-wrap ul {display:table; width:100%; table-layout: fixed;}
table.bbs-view tbody td.file-wrap ul li {display:table-cell; vertical-align: middle; padding-right:20px;}
table.bbs-view tbody td.file-wrap ul li + li {width:88%}
table.bbs-view tbody td.file-wrap p {color:#333; padding-left:25px; background:url('../images/icons/ico_file.png') left center no-repeat;  line-height: 1.4em; font-weight: 500; font-size: 17px}
table.bbs-view tbody td.file-wrap a { color:#666; display: inline-block; font-weight: 500;word-break: break-all; }
table.bbs-view tbody td.file-wrap a:hover { color:#333; text-decoration:underline}

table.bbs-view tbody td.btn-wrap { border-top:1px solid #eee; padding:30px; text-align: left}

table.bbs-view tbody tr:last-child td {border-bottom:1px solid #ccc}

table.bbs-view tfoot td { font-size:18px; color:#666; text-align:left }
table.bbs-view tfoot td a {color:#333;}
table.bbs-view tfoot td a .title {  padding:0 10px; width:60%; overflow:hidden; display:inline-block; vertical-align:middle; white-space:nowrap; text-overflow:ellipsis}
table.bbs-view tfoot td a:hover .title { text-decoration:underline; font-weight:500}
table.bbs-view tfoot td.prev { text-align:left;}
table.bbs-view tfoot td.next { text-align:right}
table.bbs-view tfoot td.prev span.arrow { padding:0 10px 0 32px; border-right:1px solid #e5e5e5; background:url('../images/icons/arrow_prev.png') left center no-repeat}
table.bbs-view tfoot td.next span.arrow { padding:0 32px 0 10px; border-left:1px solid #e5e5e5; background:url('../images/icons/arrow_next.png') right center no-repeat}

.bbs-view .tag { text-align:left}
.bbs-view .tag .tag_box { color:#666}

.sns_area_title {font-size:18px; display:block; margin:0; height:auto;padding-bottom: 5px}
.bbs_photo .sns_area_title {display:none}

.bbs-view .tf_admin td .tf_img,
.bbs-view .tf_admin td .tf_name_wrap { display:inline-block; vertical-align: middle}
.bbs-view .tf_admin td .tf_name_wrap { background:url('../images/icons/admin.png') left center no-repeat; padding-left: 50px;}
.bbs-view .tf_admin td .tf_img { margin-right:10px;}
.bbs-view .tf_admin td .tf_img img{ width:50px; height:50px; border-radius: 50%}
.bbs-view .tf_admin td p { font-size:14px; color:#333}

.bbs-view .tf_admin td p span + span { margin-left:10px}
.bbs-view .tf_admin td.tf_share { text-align:right;line-height: 1em}
.bbs-view .tf_admin td.tf_share a + a { margin-left:5px}


.bbs-bot {margin-top: max(4rem, 6.25vw);}
.bbs-bot ul {display:table; width:100%; padding:20px 0; table-layout: fixed; border-top:1px solid #ccc}
.bbs-bot ul + ul {border-bottom:1px solid #ccc}
.bbs-bot ul li {display:table-cell; vertical-align: middle; width:10%}
.bbs-bot ul li.label {font-weight: 500; font-size: 14px; color: #333; padding: 0; border-radius: 0; text-align: left;}
.bbs-bot ul li.arrow {width:70px; background:url("../images/icons/ico-angle-up-b.png") center no-repeat; opacity: 0.4;background-size: 15px;}
.bbs-bot ul li.subject {width:70%; color:#999}
.bbs-bot ul li.subject a {color:#333;font-weight: 500;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width: 90%;display: block; }
.bbs-bot ul li.date {color:#666; text-align: right;padding-right:30px; font-size: 14px }
.bbs-bot ul + ul li.arrow {background-image:url("../images/icons/ico-angle-down-b.png")}

.post-action{display: flex; margin-top: 3rem;}
.post-action .btn-line{line-height: 1; padding: 7px 12px; }
.post-action .btn-line:hover{text-decoration: none !important;}
.post-action .btn{padding: 7px 0 7px;}

.post-desc{padding: 20px; background-color: #f5f7fa; margin-bottom: 1rem; color: #111;}
.list-group{position: relative;}
.list-group-item:first-child {border-top-left-radius: 4px; border-top-right-radius: 4px;}
.list-group-item:last-child {margin-bottom: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
.list-group-item{display: flex; border: 1px solid #e1e1e1; padding: 0.5rem 1.5rem; margin-bottom: -1px;}
.list-group-title{width: 10%; font-weight: 500;}


/*********
* ## Board write
**********/
.bbs-write{padding: 30px; border-top: 2px solid #777;}
/* .bbs-title{text-align: center; font-size: 18px;} */
.bt-label{display: block; margin-bottom: 5px;}

.board-write .btn{width: 150px; height: 45px; line-height: 43px; padding: 0; font-size: 15px;}

.board-table .category-input {width: 100%; position: relative;}
.board-table .category-input .select-box {width: 30%; display: inline-block;}
.board-table .category-input a.btn-info {position: absolute; right: 0; top: 0; height: 38px; line-height: 38px; padding: 0 10px;}

.board-table .category-input label.error{display: block;}
.board-table textarea.dx-input{min-height: 250px;}


.well {min-height: 20px; padding: 19px; margin-bottom: 20px; background-color: #f7f7f7; border: 1px solid #d1d1d1; }
.well-sm {padding: 9px;}
.passcord li {display: inline-block; margin-right: 5px; vertical-align: middle;}
#captcha_key {height: 40px; line-height: 40px; max-width: 90px;}
#captcha-reload {font-size: 0.65rem; padding: 0.3rem; background: #cdcdcd; border-radius: 2px; cursor: pointer; }

.password-wrap .panel{margin: 100px auto;}


/**********
* ## COMMENT
**********/
#comment_write_box{margin: 60px 0 20px;}
.chk_comment_all_wrapper {padding: 15px 0 10px; font-size: 14px;}
.comment_write_box_inner {margin-top:20px; padding:20px; border: 1px solid #ccc; border-radius: 5px;}
.comment_write_button_area {margin-top:20px; display: flex; align-items: center; font-size: 14px;}
.comment_write_button_area .checkbox{display: inline-block; margin-right: 5px;}
.comment_write_button_area .btn-group{margin-top: 0; display: flex;}
.comment_write_button_area .btn{min-width: auto;}
.comment_write_button_area .btn-xs{padding: 3px 5px; background-color: #fff;}
.comment_write_button_area .btn + .btn{margin-left: 10px;}

#viewcomment{position: relative;}

.comment-list-wrap{margin-top: 40px;}
.media-wrap{border-top: 1px solid #f0f0f0; margin-top: 20px;}
.media {clear: both; margin: 15px 0; padding-bottom: 15px; border-bottom: 1px solid #f0f0f0;}
.media, .media-body {overflow: hidden; zoom: 1;}
.media-left, .media>.pull-left {padding-right: 10px;}
.media-body, .media-left, .media-right {display: block;}
.media-heading {font-size: 14px; overflow: hidden; margin-top: 0; margin-bottom: 5px; font-weight: 500;}

.media .time{font-size:12px; padding-left:10px; color: #777;}
.media .ip{font-size:12px; padding-left:10px; color: #777;}
.media .reply{float:right; font-size:12px;}
.media .reply a{padding-left:5px; font-weight: 400;}
.media .label-warning{background: #888; padding: 2px 6px; margin-right: 4px; font-weight: 400; color: #fff;}

.btn-manage-wrap{position: relative; display: inline-block;}
.btn-manage-wrap .btn{margin-left: 10px;}
.btn-admin-manage-layer { display:none;border:1px solid #ddd;position:absolute;background-color:#fff;z-index:99999;}
.btn-admin-manage-layer div.item { height:23px;border-bottom:1px solid #ddd; cursor:pointer;padding-left:2px;padding-right:10px; }
.btn-admin-manage-layer div.item { font:normal 11px 'dotum';line-height:23px; }
.btn-admin-manage-layer div.item i { width:20px;text-align:center; }



/**********
* ## ANIMATION
**********/
@keyframes scaleUp {
	0% {transform: scale(1)}
    100% {transform: scale(1.2);}
}

@keyframes aniScaleDown {
	0% {transform: scale(1.2)}
    100% {transform: scale(1);}
}

@keyframes aniScreen{
	from {felx: 0;}
    to {flex: 1;}
}

@keyframes aniLeftToRight{
	from {right: -100px;}
    to {right: 0;}
}

/* animation slideUp  */
@keyframes aniSlideUp {
	from {top: -100%;}
    to {top: -158%;}
}

@keyframes aniArrowMove{
	0% {background-position: right 0 top 4px;}
	50% {background-position: right 10px top 4px;}
	100% {background-position: right 0 top 4px;}
}

/****
* aniRotating
****/
@-webkit-keyframes aniRotating /* Safari and Chrome */ {
	from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes aniRotating {
	from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/****
* animation pf
****/
@keyframes aniPf {
    from {opacity: 0; right: -50px; }
    to {opacity: 1; right: 0; }
}
@-moz-keyframes aniPf { /* Firefox */
    from {opacity: 0; right: -50px; }
    to {opacity: 1; right: 0; }
}
@-webkit-keyframes aniPf { /* Safari and Chrome */
    from {opacity: 0; right: -50px; }
    to {opacity: 1; right: 0; }
}
@-o-keyframes aniPf { /* Opera */
    from {opacity: 0; right: -50px; }
    to {opacity: 1; right: 0; }
}

/****
* animation fadeIn
****/
@keyframes aniFadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}
@-moz-keyframes aniFadeIn { /* Firefox */
    from {opacity: 0;}
    to {opacity: 1;}
}
@-webkit-keyframes aniFadeIn { /* Safari and Chrome */
    from {opacity: 0;}
    to {opacity: 1;}
}
@-o-keyframes aniFadeIn { /* Opera */
    from {opacity: 0;}
    to {opacity: 1;}
}

/* animation aniDown  */
@keyframes aniDown {
    from {top: -200px;}
    to {top: 0;}
}

@keyframes aniUp {
    from {transform: translateY(100%); opacity: 0; visibility: hidden;}
    to {transform: translateY(0); opacity: 1; visibility: visible;}
}

/* animation gnb  */
@keyframes aniGnb {
    from {height: 0;}
    to {height: 100vh;}
}

/****
* animation gradient
****/
@-webkit-keyframes aniGradient {
	0% {background-position: 0% 50%;}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%;}
}
@keyframes aniGradient {
	0% {background-position: 0% 50%;}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%;}
}


/* Preloader */
.handle-preloader.v-2{background: -webkit-linear-gradient(0deg, #c335dc, #ff3c56 100%);}
.handle-preloader{background: -webkit-linear-gradient(0deg, #41a0ea, #f18e95 75%);}
.handle-preloader {align-items: center; -webkit-align-items: center; display: flex; display: -ms-flexbox; height: 100%; justify-content: center; -webkit-justify-content: center; position: fixed; left: 0; top: 0; width: 100%; z-index: 9999999; }
.preloader-close{position: fixed; z-index: 99999999; font-size: 18px; background: #fff; width: 30px; height: 30px; line-height: 26px; text-align: center; cursor: pointer; right: 15px; top: 15px; border-radius: 50%;}

.handle-preloader .animation-preloader {position: absolute; z-index: 100;}
.handle-preloader .animation-preloader .spinner{animation: spinner 1s infinite linear; border-radius: 50%; height: 150px; margin: 0 auto 45px auto; width: 150px; }
.handle-preloader .animation-preloader .txt-loading {text-align: center; user-select: none;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:before{animation: letters-loading 4s infinite; content: attr(data-text-preloader); left: 0; opacity: 0; top:0; position: absolute;}
.handle-preloader .animation-preloader .txt-loading .letters-loading{font-weight: 500; letter-spacing: 15px; display: inline-block; position: relative; font-size: 70px;line-height: 70px; text-transform: uppercase; color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgba(255, 255, 255, 0.30); }

.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {animation-delay: 0.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {animation-delay: 0.4s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {animation-delay: 0.6s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {animation-delay: 0.8s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before { animation-delay: 1s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before { animation-delay: 1.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before { animation-delay: 1.4s;}
.handle-preloader .loader-section {background-color: #ffffff; height: 100%; position: fixed; top: 0; width: calc(50% + 1px);}

.handle-preloader .animation-preloader .txt-loading .letters-loading:before{color: #ffffff;}

.handle-preloader .animation-preloader .spinner{border: 3px solid #ffffff; border-top-color: rgba(255, 255, 255, 0.5);}

@keyframes spinner {
	to {transform: rotateZ(360deg);}
}
@keyframes letters-loading {
	0%,
	75%,
	100% {
		opacity: 0;
		transform: rotateY(-90deg);
	}
	25%,
	50% {
		opacity: 1;
		transform: rotateY(0deg);
	}
}