@charset "utf-8";
/* CSS Document */
/* ==================================================
	웹 폰트
================================================== */
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('https://webfontworld.github.io/sunn/SUIT.css');

/**
포인트 컬러 지정
*/
:root {
    --point-color: #1d6e30;
}

/*
@font-face {
    font-family: "Pretendard";
    font-weight: 900;
    font-display: swap;
    src: local("Pretendard Black"), url(/font/pretendard/woff2/Pretendard-Black.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Black.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 800;
    font-display: swap;
    src: local("Pretendard ExtraBold"), url(/font/pretendard/woff2/Pretendard-ExtraBold.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-ExtraBold.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 700;
    font-display: swap;
    src: local("Pretendard Bold"), url(/font/pretendard/woff2/Pretendard-Bold.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Bold.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 600;
    font-display: swap;
    src: local("Pretendard SemiBold"), url(/font/pretendard/woff2/Pretendard-SemiBold.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-SemiBold.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 500;
    font-display: swap;
    src: local("Pretendard Medium"), url(/font/pretendard/woff2/Pretendard-Medium.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Medium.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 400;
    font-display: swap;
    src: local("Pretendard Regular"), url(/font/pretendard/woff2/Pretendard-Regular.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Regular.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 300;
    font-display: swap;
    src: local("Pretendard Light"), url(/font/pretendard/woff2/Pretendard-Light.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Light.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 200;
    font-display: swap;
    src: local("Pretendard ExtraLight"), url(/font/pretendard/woff2/Pretendard-ExtraLight.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-ExtraLight.woff) format("woff");
}

@font-face {
    font-family: "Pretendard";
    font-weight: 100;
    font-display: swap;
    src: local("Pretendard Thin"), url(/font/pretendard/woff2/Pretendard-Thin.woff2) format("woff2"), url(/font/pretendard/woff/Pretendard-Thin.woff) format("woff");
}
*/
.pretendard-100 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
}

.pretendard-200 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 200;
    font-style: normal;
}

.pretendard-300 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

.pretendard-400 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.pretendard-500 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.pretendard-600 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}

.pretendard-700 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.pretendard-800 {
    font-family: "Pretendard", sans-serif;
    font-optical-sizing: auto;
    font-weight: 800;
    font-style: normal;
}

.pretendard-900 {
    font-family: "Pretendard", sans-serif;
    font-weight: 900;
}

.suit-100 {
    font-family: "SUIT", sans-serif;
    font-weight: 100;
}

.suit-200 {
    font-family: "SUIT", sans-serif;
    font-weight: 200;
}

.suit-300 {
    font-family: "SUIT", sans-serif;
    font-weight: 300;
}

.suit-400 {
    font-family: "SUIT", sans-serif;
    font-weight: 400;
}

.suit-500 {
    font-family: "SUIT", sans-serif;
    font-weight: 500;
}

.suit-600 {
    font-family: "SUIT", sans-serif;
    font-weight: 600;
}

.suit-700 {
    font-family: "SUIT", sans-serif;
    font-weight: 700;
}

.suit-800 {
    font-family: "SUIT", sans-serif;
    font-weight: 800;
}

.suit-900 {
    font-family: "SUIT", sans-serif;
    font-weight: 900;
}

pre, code {
	color: #ddd;
	background: none;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre {
    padding: 1em;
    margin: 1.5rem 0;
    overflow: auto;
	background: #282c34;
	border-radius: 0.75rem;
}

code {
    border-radius: 0;
    padding: initial;
}@charset "utf-8";

/* CSS Document */
.col-cen{display:flex; flex-direction: column; justify-content: center; align-items: center;}
.row-cen{display: flex; justify-content: center; align-items: center;}
.row-end{display: flex; justify-content: space-between; align-items: center;}
.row-left{display: flex; justify-content: left; align-items: center;}

.uppercase {text-transform: uppercase;}
.capitalize {text-transform: capitalize;}

.txt-line{text-overflow:ellipsis; overflow:hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}

svg path,
svg rect{transition: all 0.2s linear;}

.hv-bg,
.hv-cl{transition: all 0.2s linear;}
.hv:hover .hv-bg{background-color: var(--point-color) !important;}
.hv:hover .hv-cl{color: var(--point-color) !important;}

.cl{color: var(--point-color);}

/* ==================================================
	공통레이아웃
================================================== */
#header, #footer {width: 100%;}
.size {width: 100%; max-width: 1420px; height: auto; margin: 0 auto; padding: 0 20px; box-sizing: border-box;}
.inner {width: 100%; box-sizing: border-box;}
.wrapper {position: relative; max-width: 100%; width: 100%; overflow: hidden; min-height: 600px;}

/* ==================================================
	header
================================================== */
#header{position: fixed; left: 0; top: 0; width: 100%; z-index: 100; background-color: #fff; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10);}
#header.absolute{position:absolute;}
#header:before{content:''; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: rgba(221,221,221,0.3);}
#header .size{height: 80px;}

#header .logo .white{display: none;}
#header .logo .black{display: block;}

#header.fixed .gnb{display: none;}
#header .gnb .depth1 > li{position:relative; width: 160px; text-align: center;}
#header .gnb .depth1 > li:before{opacity:0; content:''; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px; background-color: var(--point-color); transition: opacity 0.2s linear;}
#header .gnb .depth1 > li:hover:before{opacity: 1;}
#header .gnb .depth1 > li > a{display: block; line-height: 80px; font-size: 18px; font-weight: 700;}
#header .gnb .depth1 > li > a.on{color: var(--point-color);}
#header .gnb .depth2{display:none; position: absolute; left: 0; top: 80px; gap:5px; width: 160px; padding: 30px 20px; background-color: #fff; border-radius: 0 0 5px 5px; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); box-sizing: border-box;}
#header .gnb .depth2 > li{width: 100%;}
#header .gnb .depth2 > li > a{display: block; padding: 10px; font-size: 16px; font-weight: 600; color: #333; line-height: 1; transition: color 0.2s linear;}
#header .gnb .depth2 > li > a:hover,
#header .gnb .depth2 > li > a.on{color: var(--point-color);}

#header .search{display: none;}
#header.fixed .search{display: block;}

.header-search .input{position: relative; border: 1px solid #ddd; border-radius: 25px;}
.header-search .input:has(input[type="text"]:focus){border: 1px solid var(--point-color);}

.header-search .input input[type="text"]{display: block; width: 500px; height: 48px; padding: 15px 30px; padding-right:60px; border: none; border-radius:25px; background-color: #f1f1f1; font-size:16px; font-weight:500; box-sizing: border-box;}
.header-search .input input[type="text"]:focus{outline: none; background-color: #fff;}
.header-search .input input[type="text"]::placeholder{font-size: 16px; font-weight: 500; color: #999;}
.header-search .input input[type="text"]:focus::placeholder{color: #fff;}
.header-search .input button[type="submit"]{position:absolute; right:30px; top:50%; margin-top: -10px; font-size: 0;}

#header .util{gap: 30px;}
#header .my-account ul{gap: 24px;}
#header .my-account ul li a{display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 6px;}
#header .my-account ul li a .svg{width: 42px; height: 42px; border-radius: 100%; background-color: #f0f0f0;}
#header .my-account ul li a:hover .svg path{fill: #fff;}
#header .my-account ul li a em{display: block; font-size: 12px; font-weight: 700; line-height: 1;}

#header .btn-wrap{display:none; gap: 15px;}
#header.fixed .btn-wrap{display: flex;}

#header .btn-search-open{display: none;}

#header .btn-allmenu-open{display: none;}
#header.fixed .btn-allmenu-open{display: block;}

.allmenu{position: fixed; left: 100%; top: 0; width: 100%; height: 100%; z-index: 150;}
.allmenu .allmenu-bg{display:none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); z-index: 100;}
.allmenu .allmenu-wrap{position: absolute; right: 0; top: 0; justify-content: space-between; align-items: normal; width: 100%; max-width: 480px; height: 100%; overflow-y: auto; background-color: #fff; box-sizing: border-box; z-index: 125;}
.allmenu .allmenu-wrap .top{justify-content: end; height: 80px; padding: 27px 30px; box-sizing: border-box;}

.allmenu .allmenu-wrap .mid{padding: 10px 30px;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li{border-bottom: 1px solid #ececec;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a{display: block; font-size: 18px; font-weight: 700; line-height: 1.3; padding: 28px 0;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.on,
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.open{color: var(--point-color);}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.ico{position:relative;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.ico:before{content:''; display: block; position: absolute; right: 0; top: 50%; width:18px; height:10px; margin-top:-5px; background-image: url(/img/svg/ico-gnb-select-down.svg);}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.ico.on:before{background-image: url(/img/svg/ico-gnb-select-up.svg);}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.ico:after{opacity:0; content:''; display: block; position:absolute; left:0; bottom:0; width: 100%; height: 3px; background-color: var(--point-color); transition: opacity 0.2s linear;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.ico.on:after{opacity: 1;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a.open + .depth2{display: block;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth2{display:none; padding: 24px 20px;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li{padding: 15px 10px;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li > a{position:relative; display: block; padding-left:10px; font-size: 16px; font-weight: 600; color: #333; line-height: 1.3; transition: color 0.2s linear;}
.allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li > a:hover,
.allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li > a.on{color: var(--point-color);}
.allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li > a:before{content:''; display: block; position:absolute; left:0; top:7px; width: 5px; height: 5px; border-radius: 100%; background-color: var(--point-color);}
.allmenu .allmenu-wrap .btm{display:none; padding: 20px;}
.allmenu .allmenu-wrap .btm > ul{gap: 6px;}
.allmenu .allmenu-wrap .btm > ul > li{width: 100%;}
.allmenu .allmenu-wrap .btm > ul > li > a{display: block; height: 50px; line-height: 50px; border-radius: 8px; font-size: 14px; font-weight: 700; text-align: center; box-sizing: border-box;}


.search-mo{position:fixed; left:0; top:-150px; width: 100%; z-index: 130; background-color: #fff;}
.search-mo.open{box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.05);}
.search-mo .top{height:60px; line-height: 60px;}
.search-mo .top .logo img{width: 90px;}
.search-mo .top .btn-search-close img{width: 18px;}

.search-mo .btm{padding: 20px 0; border-top: 1px solid #ececec; margin-top:-1px;}
.search-mo .btm .input input[type="text"]{width: 100%; padding: 15px 20px; padding-right: 58px; font-size: 14px;}
.search-mo .btm .input input[type="text"]::placeholder{font-size: 14px;}
.search-mo .btm .input button[type="submit"]{right: 20px; margin-top: -9px;}
.search-mo .btm .input button[type="submit"] img{width: 18px;}

/* ==================================================
	footer
================================================== */
#footer{padding: 55px 0; background-color: #f1f1f1;}
#footer .size{flex-wrap: wrap; gap: 20px;}
#footer .left .logo img{width: 116px;}
#footer .left .info-list{margin-top: 24px;}
#footer .left .info-list ul{padding-top:6px; gap: 23px;}
#footer .left .info-list ul:first-of-type{padding-top:0;}
#footer .left .info-list ul li{position: relative; font-size: 14px; line-height: 1.3; color: #666;}
#footer .left .info-list ul li:before{content:''; display: block; position: absolute; left: -12px; top:4px; width: 1px; height: 10px; background-color: #b7b7b7;}
#footer .left .info-list ul li:first-of-type:before{display: none;}
#footer .left .info-list p{font-size: 12px; line-height: 1.3; color: #666;}
#footer .left .copy{margin-top: 13px;}
#footer .left .copy p{font-size: 14px; font-weight: 500; color: #999; line-height: 1.2;}

#footer .right .sns-list ul{gap: 10px;}
#footer .right .sns-list ul li a{display: block; width: 74px; height: 74px; line-height: 74px; border-radius: 100%; text-align: center; box-sizing: border-box; font-size: 0; background-color: var(--point-color);}

/* ==================================================
	common
================================================== */
/* star */
.star{gap: 2px;}

/* condition-search */
.condition-search .form{position:relative; border-radius:10px; background-color: #fff; box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.08);}
.condition-search .top .inner{padding: 30px 30px 20px;}
.condition-search .ta .top{position: relative;}
.condition-search .ta .top:before{content:''; display: block; position:absolute; left:20px; right:20px; bottom:0; height:1px; background-color: #ddd;}
.condition-search .ta .top .inner{padding: 0 20px;}
.condition-search .ta .top a{position:relative; display: block; font-size: 14px; font-weight: 600; line-height: 60px;}
.condition-search .ta .top a:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-4px; width:12px; height:8px; background-image: url(/img/svg/ico-keyword-open.svg);}

.condition-search .top .check-label-list ul{margin:0 -4px; }
.condition-search .top .check-label-list ul li{width:12.5%; padding:0 4px; box-sizing: border-box;}

.condition-search .mid{position:relative; padding:0 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.condition-search .mid .dropdown-list > ul{margin: 0 -20px;}
.condition-search .mid .dropdown-list .depth1{padding:15px 20px; width:20%; box-sizing: border-box;}
.condition-search .mid .dropdown-list .depth1 > a{position:relative; height:50px;}
.condition-search .mid .dropdown-list .depth1 > a:after{content:''; display: block; position:absolute; left:-20px; top:50%; width:1px; height:40px; margin-top:-20px; background-color: #ddd;}
.condition-search .mid .dropdown-list .depth1:first-of-type > a:after{display: none;}
.condition-search .mid .dropdown-list .depth1 > a.ico{padding-right: 18px; gap: 10px;}
.condition-search .mid .dropdown-list .depth1 > a.ico:before{content:''; display: block; position:absolute; right:0; top:50%; width: 18px; height: 18px; margin-top:-9px; background-image: url(/img/svg/ico-search-select-down.svg);}
.condition-search .mid .dropdown-list .depth1 > a.ico.on:before{background-image: url(/img/svg/ico-search-select-up.svg);}

.condition-search .mid .dropdown-list .depth1 > a:hover svg path,
.condition-search .mid .dropdown-list .depth1 > a.on svg path{fill: var(--point-color);}
.condition-search .mid .dropdown-list .depth1 > a em{display: block; font-size: 1.8rem; font-weight: 700;}
.condition-search .mid .dropdown-list .depth1 > a.on em{color: var(--point-color);}

.condition-search .mid .dropdown-list .depth1 > a.row-end .row-left{gap: 10px;}
.condition-search .mid .dropdown-list .depth1 > a.row-end .input input[type="number"],
.search-filter .mid .filter-list .depth1 > a .input input[type="number"]{display:block; text-align: right; width:75px; height:40px; padding:0 10px; border-radius:5px; border:1px solid #ddd; font-size: 1.8rem; font-weight: 700; color:var(--point-color); box-sizing: border-box;}
.condition-search .mid .dropdown-list .depth1 > a.row-end .input input[type="number"]:focus,
.search-filter .mid .filter-list .depth1 > a .input input[type="number"]{outline: none;}
.condition-search .mid .dropdown-list .depth1 > a.row-end .input input[type="number"]:read-only,
.search-filter .mid .filter-list .depth1 > a .input input[type="number"]:read-only{border: 1px solid transparent; background-color: transparent; color: #111;}

.condition-search .mid .dropdown-list .depth2{display:none; position:absolute; left:0; top:100%; width: 100%; padding: 30px 30px 20px; border-radius: 0 0 10px 10px; border-top: 2px solid var(--point-color); background-color: #fff; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.08); box-sizing: border-box; z-index: 5;}
.condition-search .mid .dropdown-list .depth2 .check-box-list ul{margin: -10px -5px; flex-wrap: wrap;}
.condition-search .mid .dropdown-list .depth2 .check-box-list ul li{width: 20%; padding: 10px 5px; box-sizing: border-box;}
.condition-search .mid .dropdown-list .depth2 .btn-complete{margin-top: 40px;}
.condition-search .mid .dropdown-list .depth2 .btn-complete button{display: block; margin:0 auto; width:180px; height:50px; border-radius: 10px; background-color: var(--point-color); font-size: 14px; font-weight: 700; color: #fff; transition: all 0.2s linear;}
.condition-search .mid .dropdown-list .depth2 .btn-complete button:hover{box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.50);}

.condition-search .pc .btm{align-items: flex-start; gap: 10px; padding: 30px; padding-bottom: 85px;}
.condition-search .ta .btm{padding: 15px 20px 20px;}

.condition-search .pc .btm .keyword-list{align-items: flex-start; gap: 20px;}
.condition-search .btm .keyword-list .list-tit b{display: block; height:34px; line-height: 34px; font-weight: 700;}
.condition-search .ta .btm .keyword-list .list-tit b{height: auto; line-height: normal; font-size: 14px; font-weight: 600;}

.condition-search .pc .btm .keyword-list ul{gap: 10px; flex-wrap: wrap;}
.condition-search .btm .keyword-list ul li{display:flex; justify-content: center; align-items: center; gap: 10px; padding: 9px 20px; border-radius: 17px; border: 1px solid var(--point-color); background-color: rgba(29, 110, 48, 0.05); box-sizing: border-box;}
.condition-search .ta .btm .keyword-list ul li{width:auto !important; gap: 5px; border-radius: 16px;}

.condition-search .btm .keyword-list ul li span{display: block; font-size: 14px; font-weight: 700; color: var(--point-color); line-height: 1;}
.condition-search .ta .btm .keyword-list ul li span{font-size: 12px;}
.condition-search .ta .btm .keyword-list ul li button img{width: 8px;}
.condition-search .ta .btm .keyword-list .keyword-swiper{padding-top: 15px; overflow: hidden;}

.condition-search .btm .btn-reset button{padding: 10px 15px; border-radius: 5px; background-color: #111; font-size: 14px; font-weight: 700; color: #fff; line-height: 1;}
.condition-search .ta .btm .btn-reset button{font-size: 12px;}

.condition-search .btn-search{position:absolute; left:50%; bottom:-40px; transform: translateX(-50%);}
.condition-search .btn-search button{display: block; width: 480px; height: 70px; font-size: 2rem; font-weight: 800; color: #fff; border-radius: 10px; background-color: var(--point-color); transition: all 0.2s linear;}
.condition-search .btn-search button:hover{width: 580px; height: 80px; font-size: 24px;}

/* swiper */
.swiper .mo-pagination{margin-top: 25px; gap: 8px;}
.swiper .mo-pagination .swiper-pagination-bullet{width: 10px; height: 10px; background-color: #ddd; margin: 0 !important; opacity: 1;}
.swiper .mo-pagination .swiper-pagination-bullet-active{background-color: var(--point-color);}

/* search-filter */
.search-filter{position:fixed; left:0; top:100%; width: 100%; height:100%; z-index: 200;}
.search-filter > .inner{height:100%; background-color: #fff; border-radius: 20px 20px 0 0; overflow: hidden;}
.search-filter .filter-wrap{height: 100%; overflow-y: auto; justify-content: space-between; align-items: normal;}
.search-filter .top{position:relative; height: 60px; border-bottom: 1px solid #ececec;}
.search-filter .top .btn-filter-close{position:absolute; display:block; left:0; top:50%; margin-top:-7px; font-size: 0;}
.search-filter .top .filter-tit{text-align: center;}
.search-filter .top .filter-tit strong{display: block; font-size: 18px; font-weight: 700; line-height: 60px;}

.search-filter .mid{padding-top: 20px;}
.search-filter .mid .filter-list .depth1{border-bottom: 1px solid #ececec;}
.search-filter .mid .filter-list .depth1 > a{height:70px; gap: 5px;}
.search-filter .mid .filter-list .depth1 > a.on{color: var(--point-color);}
.search-filter .mid .filter-list .depth1 > a.on svg path{fill: var(--point-color);}
.search-filter .mid .filter-list .depth1 > a.ico{position:relative; padding-right: 22px;}
.search-filter .mid .filter-list .depth1 > a.ico:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-11px; width: 22px; height: 22px; background-image: url(/img/svg/ico-filter-down.svg);}
.search-filter .mid .filter-list .depth1 > a.ico.on:before{background-image: url(/img/svg/ico-filter-up.svg);}
.search-filter .mid .filter-list .depth1 > a.ico.on:after{content:''; display: block; position:absolute; left:0; bottom:0; width: 100%; height: 3px; background-color: var(--point-color);}
.search-filter .mid .filter-list .depth1 > a em{display: block; font-size: 16px; font-weight: 700;}
.search-filter .mid .filter-list .depth1 > a .row-left{gap: 5px;}

.search-filter .mid .filter-list .depth2{display: none;}
.search-filter .mid .filter-list .depth2 .inner{padding: 20px 0;}
.search-filter .mid .filter-list .depth2 .check-box-list ul{flex-wrap: wrap; margin: -5px -3px;}
.search-filter .mid .filter-list .depth2 .check-box-list ul li{width: 25%; padding: 5px 3px; box-sizing: border-box;}
.search-filter .mid .filter-list .depth2 .check-box-list .check-box{min-height: 20px;}
.search-filter .mid .filter-list .depth2 .check-box-list .check-box label{font-size: 14px;}
.search-filter .mid .filter-list .depth2 .check-box-list .check-box label:before{width: 20px; height: 20px; margin-top: -10px;}

.search-filter .btm{padding: 20px 0;}
.search-filter .btm button[type="submit"]{display: block; width: 100%; height: 50px; border-radius: 10px; font-size: 14px; font-weight: 700;}

/* check-label-list */
.check-label-list ul li input[type="checkbox"],
.check-label-list ul li input[type="radio"]{display: none;}
.check-label-list ul li input[type="checkbox"] + label,
.check-label-list ul li input[type="radio"] + label{display:block; height:46px; line-height:46px; font-weight:700; background-color: #ececec; border-radius:5px; color:#666; text-align: center; cursor:pointer; transition: all 0.2s linear; box-sizing: border-box;}
.check-label-list ul li input[type="checkbox"] + label:hover,
.check-label-list ul li input[type="radio"] + label:hover{background-color: var(--point-color); color: #fff;}
.check-label-list ul li input[type="checkbox"]:checked + label,
.check-label-list ul li input[type="radio"]:checked + label{background-color: var(--point-color); color: #fff;}

.check-label-list ul{margin: 0 -5px;}
.check-label-list ul li{padding:0 5px; width: 50%; box-sizing: border-box;}
.check-label-list ul li input[type="radio"] + label{padding:0 20px; height:70px; line-height:70px; background-color: #f8f8f8; border: 1px solid #ececec; border-radius:10px; color:#777; text-align: left;}
.check-label-list ul li input[type="radio"] + label:hover{background-color: #111; color: #fff; border: 1px solid #111;}
.check-label-list ul li input[type="radio"]:checked + label{background-color: #111; color: #fff; border: 1px solid #111;}

/* box-list */
.box-list-wrap{position: relative;}
.box-list-wrap .swiper{position: relative; overflow: hidden;}
.box-list-wrap .swiper-util button{position:absolute; top:50%; margin-top:-35px; display:block; opacity: 0.9; width:70px; height:70px; border-radius: 100%; background-image: linear-gradient(141deg, #FFF 13.12%, #EEE 83.43%);; box-shadow: 0px 0px 10px rgba(22, 40, 26, 0.20); font-size: 0; transition: all 0.2s linear; z-index: 10;}
.box-list-wrap .swiper-util button:hover{background: var(--point-color); box-shadow: 0px 0px 10px rgba(3, 9, 4, 0.50);}
.box-list-wrap .swiper-util button.prev{left:-35px;}
.box-list-wrap .swiper-util button.next{right:-35px;}
.box-list-wrap .swiper-util button:hover svg path{fill: #fff;}

.box-list > ul:not(.swiper-wrapper){display:flex; justify-content: left; align-items: flex-start; margin: -15px -10px; flex-wrap: wrap;}
.box-list > ul:not(.swiper-wrapper) > li{width:25%; padding: 15px 10px; box-sizing: border-box;}
.box-list > ul > li > .inner{position:relative; border-radius: 10px; overflow: hidden; border: 1px solid #f1f1f1; box-sizing: border-box;}
.box-list .normal .txt-wrap{border-top: 1px solid #f1f1f1;}
.box-list .normal .txt-wrap .inner{padding: 20px 30px 25px; background-color: #fff;}
.box-list .normal .txt-wrap .top{padding-bottom: 20px;}
.box-list .normal .txt-wrap .top .title{line-height: 1.2;}
.box-list .normal .txt-wrap .top .title i{height:17px; font-size: 14px; font-weight: 300;}
.box-list .normal .txt-wrap .top .title em{margin-top:5px; height:24px; font-size: 20px; font-weight: 800;}

.box-list .normal .txt-wrap .top .star-rating{margin-top:15px; gap: 5px;}
.box-list .normal .txt-wrap .top .star-rating .num{display: block; font-size: 12px; font-weight: 600; color: #999; line-height: 1;}

.box-list .normal .txt-wrap .top .price{margin-top: 15px; color: var(--point-color); text-align: right; line-height: 100%;}
.box-list .normal .txt-wrap .top .price p{font-size: 18px;}
.box-list .normal .txt-wrap .top .price p strong{font-size: 24px; font-weight: 800;}

.box-list .normal .txt-wrap .btm{padding-top: 20px; border-top: 1px solid #f1f1f1;}
.box-list .normal .txt-wrap .btm .lecturer b{position:relative; display: block; padding-left: 20px; font-size: 14px; font-weight: 700; color: #666; line-height: 1.2;}
.box-list .normal .txt-wrap .btm .lecturer b:before{content:''; display: block; position:absolute; left:0; top:50%; margin-top:-7.5px; width: 15px; height:15px; background-image: url(/img/svg/ico-box-person.svg);}
.box-list .normal .txt-wrap .btm .btn-favorite{display: none; font-size: 0;}

.box-list .hover{display:none; position:absolute; left:0; top:0; width: 100%; height: 100%;}
.box-list .hover .inner{justify-content: space-between; height: 100%; padding: 30px; box-sizing: border-box; background-color: rgba(0,0,0,0.95);}
.box-list .hover .inner > * {width: 100%;}
.box-list .hover .title em{height:24px; font-size: 2rem; font-weight: 800; line-height: 1.2; color: #fff;}
.box-list .hover .info-list{margin-top: 15px; max-height:calc(100% - 46px); overflow-y: auto;}
.box-list .hover .info-list > ul > li{padding: 13px 0; border-top:1px solid rgba(255,255,255,0.2);}
.box-list .hover .info-list > ul > li:first-of-type{border-top: none;}
.box-list .hover .info-list .list-tit b{position: relative; display:block; padding-left: 11px; font-size: 1.4rem; font-weight: 800; color: rgba(217,217,217,0.6); line-height: 1.2;}
.box-list .hover .info-list .list-tit b:before{content:''; display: block; position:absolute; left:0; top:5px; width: 6px; height:6px; border-radius: 100%; background-color: var(--point-color);}
.box-list .hover .info-list .list-con{margin-top: 5px;}
.box-list .hover .info-list .list-con p{font-size: 1.4rem; color: #fff; line-height: 1.3;}

.box-list .hover .btn-wrap{margin-top:15px; gap: 5px;}
.box-list .hover .btn-wrap .btn-view{width: 100%;}
.box-list .hover .btn-wrap .btn-view > a{display: block; height: 40px; line-height: 40px; border-radius: 5px; font-size: 1.4rem; font-weight: 800; color: #d9d9d9; background-color: #666; text-align: center; transition: all 0.2s linear;}
.box-list .hover .btn-wrap .btn-view > a:hover{background-color: var(--point-color); color: #fff;}
.box-list .hover .btn-wrap .btn-favorite{flex: none;}
.box-list .hover .btn-wrap .btn-favorite > button{width: 40px; height: 40px; border-radius: 5px; background-color: rgba(255,255,255,0.1); font-size: 0;}
.box-list .hover .btn-wrap .btn-favorite > button:hover svg path, .box-list .hover .btn-wrap .btn-favorite > button.active svg path{fill:#f00;}

/* book-list */
.book-list ul:not(.swiper-wrapper){margin: -15px -10px; flex-wrap: wrap;}
.book-list ul:not(.swiper-wrapper) > li{width:25%; padding: 15px 10px; box-sizing: border-box;}
.book-list ul > li a{display:block; padding: 50px; border:1px solid #f1f1f1; border-radius: 10px; background-color: #fff; box-sizing: border-box; transition: all 0.2s linear;}
.book-list ul > li a:hover{box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.10);}

.book-list ul > li .img-wrap{text-align: center;}
.book-list ul > li .img-wrap .img{border: 1px solid #f1f1f1;}
.book-list ul > li .txt-wrap{margin-top: 25px; text-align: center;}
.book-list ul > li .txt-wrap .title em{height:22px; font-size: 18px; font-weight:800; line-height: 1.2; color:#111;}
.book-list ul > li .txt-wrap .summary{margin-top: 10px;}
.book-list ul > li .txt-wrap .summary p{height:42px; font-size: 14px; line-height: 1.5; -webkit-line-clamp:2; color: #666;}

/* pagination */
.pagination{margin-top:40px; gap: 20px;}
.pagination.pcta{display:flex;}
.pagination.mo{display: none;}
.pagination > ul{display: flex; align-items: center; justify-content: center;}
.pagination > ul a{display:block; width: 36px; height:36px; line-height: 36px; text-align: center;}
.pagination > ul.btn-move{gap: 10px;}
.pagination > ul.btn-move a:hover svg path{stroke: #111;}
.pagination > ul.btn-num{gap: 5px;}
.pagination > ul.btn-num a{font-size: 1.5rem; transition: color 0.2s linear;}
.pagination > ul.btn-num a:not(.current):hover{color: var(--point-color);}
.pagination > ul.btn-num .current{font-weight: 700; color:#fff; background-color: var(--point-color); border-radius: 100%;}

/* search-top */
.search-top{margin-bottom: 15px;}
.search-top form{justify-content: right; gap: 5px;}
.search-top .search-txt{position:relative; width: 100%; max-width: 340px;}
.search-top .search-txt input[type="text"]{height: 50px; padding-right:48px; border-radius: 8px; background-color: #fff;}
.search-top .search-txt button[type="submit"], .search-top .search-txt button[type="button"]{position:absolute; right:15px; top:50%; margin-top:-9px; width: 18px; height:18px; font-size: 0;}

/* board-select */
.board-select{position:relative; width:100%; max-width: 112px;}
.board-select > a{position:relative; display: block; width: 100%; height: 50px; line-height: 48px; padding: 0 15px; border-radius: 8px; border: 1px solid #ececec; background-color: #fff; font-size: 14px; font-weight: 600; box-sizing: border-box;}
.board-select > a:before{content:''; display: block; position:absolute; right:15px; top:50%; margin-top:-3px; width:10px; height:6px; background-image:url(/img/svg/ico-board-select-down.svg);}
.board-select > a.on{border-radius: 8px 8px 0 0; border-bottom: none;}
.board-select > a.on:before{background-image: url(/img/svg/ico-board-select-up.svg);}
.board-select > ul{display:none; position:absolute; left:0; top:49px; width: 100%; border-radius: 0 0 8px 8px; border: 1px solid #ececec; border-top:none !important; background-color: #fff; box-sizing: border-box; z-index: 10;}
.board-select > ul li a{display: block; padding:0 15px; height: 45px; line-height: 45px; border-top: 1px solid #f1f1f1; font-size: 15px; transition: color 0.2s linear;}
.board-select > ul li a:hover{color: var(--point-color);}

/* form-select */
.form-select{max-width: 100%;}
.form-select > a{height: 70px; line-height: 68px; padding:0 20px; border-radius: 10px; font-size: 1.6rem; font-weight: 600;}
.form-select > a:before{right:20px; margin-top:-5px; width:16px; height:10px;}
.form-select > a.on{border-radius: 10px 10px 0 0;}
.form-select > ul{top:69px; border-radius: 0 0 10px 10px;}
.form-select > ul li a{padding: 0 20px; height: 60px; line-height: 60px; font-size: 1.6rem; font-weight: 600;}

/* video-wrap */
.video-wrap{position: relative; width: 100%; height: 100%; padding-bottom: 56.24%; box-sizing: border-box; border: 0; overflow: hidden;}
.video-wrap iframe,
.video-wrap video{position:absolute; left:0; top:0; width: 100%; height: 100%; z-index: 5; border: 0; outline: 0;}

/* form */
.form-wrap .form-row{margin-top: 25px;}
.form-wrap .form-row:first-of-type{margin-top:0;}
.form-wrap .form-row:has(.col){display:flex; align-items: stretch; gap: 10px;}
.form-wrap .form-row:has(.col) .col{width: 100%;}

.form-wrap .form-label{margin-bottom: 10px; gap:10px; row-gap:5px; flex-wrap: wrap;}
.form-wrap .form-label label{display: block; font-weight: 700; line-height: 100%;}
.form-wrap .form-label label.require{position: relative; padding-right: 10px;}
.form-wrap .form-label label.require:before{content: "*"; display: block; position: absolute; right: 0; top: 0; color: #ea0000;}

/* form-file */
.form-file{position: relative;}
.form-file > label{display: block; position:absolute; right:15px; top:50%; margin-top:-23px; width:112px; height:46px; line-height: 46px; text-align: center; background-color: #ececec; border-radius: 8px; font-size: 14px; font-weight: 700; color: #666; cursor: pointer;}
.form-file.changed > label{background-color: #111; color: #fff;}

.form-file .form-file-text{padding-left: 20px; padding-right: 142px; height: 70px; border-radius: 10px; border: 1px solid #ececec;}
.form-file .form-file-text p{font-weight: 600; color: #999;}
.form-file.changed .form-file-text p{color: #111;}

.form-file .file-hidden{display: none;}
.form-file .btn-file-delete{font-size: 0;}

/* form-file-list */
.form-file-list{position:relative;}
.form-file-list .form-file{margin-top: 10px;}
.form-file-list .form-file:first-of-type{margin-top:0;}

/* faq-list */
.faq-list ul li{margin-top: 10px; padding: 25px; border-radius: 10px; border: 1px solid #f1f1f1; background-color: #fff; transition: all 0.2s linear; cursor: pointer;}
.faq-list ul li:hover,
.faq-list ul li.open{border: 1px solid var(--point-color);}
.faq-list ul li:first-of-type{margin-top: 0;}

.faq-list ul li .list-tit em{position:relative; display: block; padding-left:37px; font-weight: 600; line-height: 1.2;}
.faq-list ul li .list-tit em:before{content:'Q'; display: block; position:absolute; left:0; top:50%; font-family: "SUIT", sans-serif; font-weight: 900; font-size: 2.4rem; color: var(--point-color); line-height: 1; transform: translateY(-50%);}

.faq-list ul li .list-con{display: none;}
.faq-list ul li .list-con .inner{margin-top:25px; padding-top: 25px;}
.faq-list ul li.open .list-con .inner {border-top: 1px solid #ececec;}
.faq-list ul li .list-con .answer{position:relative; padding-left: 37px; min-height: 42px;}
.faq-list ul li .list-con .answer:before{content:'A'; display: block; position:absolute; left:0; top:4px; font-family: "SUIT", sans-serif; font-weight: 900; font-size: 2.4rem; color: #111; line-height: 1;}
.faq-list ul li .list-con .answer p{font-size: 14px; line-height: 1.5; color: #666;}

/* caution */
.caution{margin-top: 10px;}
.caution p{position:relative; padding-left:14px; font-size: 13px; color: #666; line-height: 1.5;}
.caution p:before{content:'※'; display:block; position:absolute; left:0; top:0px; font-size:18px; line-height: 1;}

/* input*/
.input{position: relative;}

.input-date:before{content:''; display: block; position:absolute; right:15px; top:50%; margin-top:-11px; width:22px; height:22px; background-image: url(/img/svg/ico-calendar.svg);}
.input-date input[type="text"]{cursor: pointer;}

.input-time:before{content:''; display: block; position:absolute; right:15px; top:50%; margin-top:-11px; width:22px; height:22px; background-image: url(/img/svg/ico-time.svg);}
.input-time input[type="time"]{ color: #999;}
.input-time.changed input[type="time"]{color: #111;}
.input-time input[type="time"]::-webkit-calendar-picker-indicator{position: absolute;  left: 0; top: 0;  width: 100%; height: 100%; background: transparent; color: transparent; cursor: pointer; z-index: 5;}
.input-time input[type="date"]:after{content:''; display: block; position: absolute; right: 2px; top:2px; bottom: 2px; width: 40px; background-color: #fff; border-radius: 10px;}


.input-btn{position:relative;}
.input-btn input[type="text"]{padding-right: 152px;}
.input-btn button{position:absolute; display:block; right:15px; top:50%; margin-top:-23px; width:122px; height:46px; font-size: 14px; font-weight: 700; color: #666;  border-radius: 8px; background-color: #ececec;}


/* table */
.table-wrap{text-align: center;}
.table-wrap .table-head{background-color: #f8f8f8; border-radius: 10px;}
.table-wrap .table-head .row-cen > div{padding: 18px 15px; box-sizing: border-box;}
.table-wrap .table-head .row-cen > div b{display: block; font-size: 14px; font-weight: 600; color: var(--point-color); line-height: 1;}

.table-wrap .table-body > ul > li{margin-top: 10px; height:80px; border-radius: 10px; border: 1px solid #ececec; transition: all 0.2s linear; box-sizing: border-box;}
.table-wrap .table-body > ul > li:hover{border: 1px solid var(--point-color);}
.table-wrap .table-body > ul > li > div{padding: 18px 15px; box-sizing: border-box;}
.table-wrap .table-body > ul > li .mo-tit{display: none;}
.table-wrap .table-body > ul > li .mo-tit b{position:relative; display:block; padding-left:11px; font-size: 14px; font-weight: 700; color: #777; line-height: 1.4;}
.table-wrap .table-body > ul > li .mo-tit b:before{content:''; display: block; position:absolute; left:0; top:6px; width:6px; height:6px; border-radius: 100%; background-color: var(--point-color);}
.table-wrap .table-body > ul > li p{font-size: 14px; font-weight: 600; color: #444; line-height: 1.4;}

/* block-wrap */
.inner-box{padding: 25px; border-radius: 10px; border: 1px solid #ececec; background-color: #fff; box-sizing: border-box;}

.block-list ul li{display: flex; margin-top:10px; border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden;}
.block-list ul li:first-of-type{margin-top:0;}
.block-list ul li.row .col{display: flex; width: 100%; border-left: 1px solid #e8e8e8;}
.block-list ul li.row .col:first-of-type{border-left: none;}
.block-list ul li .list-tit{display:flex; align-items: center; width: 180px; padding: 15px; box-sizing: border-box; flex: none; background-color: #f9f9f9;}
.block-list ul li .list-tit b{display: block; font-weight: 700; color: var(--point-color);}
.block-list ul li .list-con{display:flex; justify-content: center; align-items: flex-start; flex-direction: column; width: 100%; min-height: 70px; padding: 20px 15px; border-left:1px solid #e8e8e8; background-color:#fff; box-sizing: border-box;}
.block-list ul li .list-con.long{height: 280px;}
.block-list ul li .list-con p{font-weight: 600; line-height: 1.5;}

/* preview */
.inner-box:has(.preview){gap: 20px;}
.preview{gap: 15px; text-align: left;}
.preview .img-wrap{flex: none;}
.preview .img-wrap .pic{border-radius: 10px; overflow: hidden;}
.preview .txt-wrap .title em{display: block; font-size: 1.7rem; font-weight: 800; line-height: 1.2;}
.preview .txt-wrap .content{margin-top: 12px;}
.preview .txt-wrap .content i{display: block; font-size: 14px; font-weight: 600; color: #777; line-height: 1;}
.preview .txt-wrap .content p{margin-top:4px; font-size: 14px; font-weight: 600; color: #444; line-height: 1.2;}
.preview + .on-off-line span{display: block; width: 78px; height: 34px; line-height: 34px; border-radius: 17px; background-color: var(--point-color); font-size: 12px; font-weight: 700; color: #fff; text-align: center;}

/* check-box-list-wrap */
.check-box-list-wrap > a{display: none; padding:0 15px; height: 50px; line-height: 48px; border-radius: 10px; border: 1px solid #ececec; background-color: #fff; box-sizing: border-box;}
.check-box-list-wrap > a.on{border: 1px solid var(--point-color);}
.check-box-list-wrap > a span{position: relative; display: block; padding-right: 21px; font-size: 14px; font-weight: 500;}
.check-box-list-wrap > a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-3px; width:11px; height:6px; background-image: url(/img/svg/ico-check-drop-down.svg);}
.check-box-list-wrap > a.on span:before{background-image: url(/img/svg/ico-check-drop-up.svg);}

/* btn */
.btn-btm{margin-top: 40px; gap: 10px;}
.btn-btm a,
.btn-btm button{display: block; margin: 0 auto; width: 220px; height: 70px; line-height: 68px; border-radius: 35px; font-size:1.6rem; font-weight:700; text-align: center; box-sizing: border-box;}

.btn-blk > a{border: 1px solid #000; transition: all 0.2s linear;}
.btn-blk > a:hover{background-color: #111; color: #fff;}

.btn-gr > a,
.btn-gr > button{background-color: var(--point-color); color: #fff !important;}

.btn-gr-line > a,
.btn-gr-line > button{color: var(--point-color) !important; border: 1px solid var(--point-color);}

/* popup */
.popup{display:none; position:fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); overflow-y: auto; z-index: 300;}
.popup-inner{display: flex; align-items: center; min-height: calc(100% - 40px); margin: 20px auto;}
.popup-box{position:relative; width:100%; border-radius:10px; background-color: #fff;}

.popup-box .pop-tit{text-align: center;}
.popup-box .pop-tit strong{display: block; font-size: 2.4rem; font-weight: 700; line-height: 1.2;}
.popup-box .pop-tit.big strong{font-size: 3.6rem;}

.btn-popup-close{position:absolute; right:20px; top:20px;}
.btn-popup-close button{display: block ; width: 42px; height: 42px; font-size: 0;}

/* popup-share */
#popup-share .popup-inner{max-width: 520px;}
#popup-share .popup-box{padding: 50px 30px 30px;}
#popup-share .pop-con{margin-top: 30px;}
#popup-share .sns-list > ul{gap: 10px;}
#popup-share .share-link{margin-top: 15px; gap: 10px;}
#popup-share .share-link .input{width: 100%;}
#popup-share .share-link .input input[type="text"]{height: 60px;}
#popup-share .share-link button{display: block; width: 136px; height: 60px; flex: none; border-radius: 10px; background-color: var(--point-color); font-size:16px; font-weight: 700; color: #fff;}

/* popup-apply */
#popup-apply .popup-inner{max-width: 990px;}
#popup-apply .popup-box{padding: 70px 60px 60px; max-height: 860px; overflow-y: auto;}
#popup-apply .pop-con{margin-top: 40px;}

#popup-apply .form-wrap .check-box-list{margin-top: 20px;}
#popup-apply .form-wrap .check-box-list ul{row-gap: 15px; flex-wrap: wrap;}
#popup-apply .form-wrap .check-box-list ul li{width: 170.59px;}

#popup-apply .form-wrap .input-gap-btn{gap: 10px;}
#popup-apply .form-wrap .input-gap-btn .input{width: 100%;}
#popup-apply .form-wrap .input-gap-btn button{width: 220px; height: 70px; border-radius: 10px; background-color: var(--point-color); font-size: 16px; font-weight: 700; color: #fff; flex: none;}
#popup-apply .textarea textarea{min-height: 280px;}
#popup-apply .btn-apply{margin-top: 40px;}
#popup-apply .btn-apply button[type="submit"]{display: block; margin:0 auto; width: 220px; height: 70px; border-radius: 35px; background-color: var(--point-color); font-size: 16px; font-weight: 700; color: #fff;}

/* popup-password */
[id ^="popup-password"] .popup-inner{max-width: 520px;}
[id ^="popup-password"] .popup-box{padding: 50px 30px 30px;}
[id ^="popup-password"] .pop-con{margin-top: 30px;}
[id ^="popup-password"] .form-wrap .input input[type="password"]{height: 60px;}
[id ^="popup-password"] .form-wrap .btn-submit{margin-top: 20px;}
[id ^="popup-password"] .form-wrap .btn-submit button[type="submit"]{display: block; margin:0 auto; width: 136px; height: 60px; border-radius: 10px; background-color: var(--point-color); font-size:1.6rem; font-weight: 700; color: #fff;}

/* popup-scroll */
.popup-scroll .popup-inner{max-width: 520px;}
.popup-scroll .popup-box{padding: 50px 30px 30px;}
.popup-scroll .pop-con{margin-top: 30px;}
.popup-scroll .scroll-box{padding: 20px; padding-right: 15px; border-radius: 10px; border: 1px solid #ececec; background-color: #f8f8f8;}
.popup-scroll .scroll-box .scroll{max-height: 260px; padding-right: 10px; font-size: 1.4rem; color: #666;}

/* scroll */
.scroll::-webkit-scrollbar {width: 3px;}
.scroll::-webkit-scrollbar-thumb {background: var(--point-color); border-radius: 3px;}
.scroll::-webkit-scrollbar-track {background: #ddd; border-radius: 3px;}

.scroll{-ms-overflow-style: none; overflow-y: auto;}
/* ==================================================
	skip
================================================== */
a.skip {
    display: block;
    position: absolute;
    top: -1px;
    z-index: 999;
    width: 0;
    height: 0;
    overflow: hidden;
    text-align: center
}

a.skip:active, a.skip:focus {
    z-index: 999;
    width: 100%;
    height: auto;
    padding: 5px;
    background: #FFF
}

a:hover {
    transition: all .4s ease;
    -webkit-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
}


h2 {
    margin: 0 0 10px 0;
}

input[type=button] {
    cursor: pointer !important;
}

.bt {
    cursor: pointer !important;
}


/* inptu / select / textarea */
input[type='text'], input[type='password'], input[type='tel'], input[type='email'], input[type='number'], input[type='url'], select, input[type="time"] {
    width: 100%;
    height: 70px;
    padding: 0 20px;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #ececec;
    border-radius: 10px;
    box-sizing: border-box;
    font-weight: 600;
}

input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="number"], input[type="url"]{
    text-overflow:ellipsis; overflow:hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
}

.textarea textarea {
    width: 100%;
    min-height: 200px;
    padding: 23px 20px;
    background-color: #fff;
    border: 1px solid #ececec;
    border-radius: 10px;
    box-sizing: border-box;
    font-weight: 600;
    resize:none;
}

.readonly input[readonly], .readonly input[readonly="readonly"], .readonly input:read-only {
    background-color: #f8f8f8; color: var(--point-color);
}

/* 셀렉트박스 */
.select {
    display: inline-block;
    position: relative;
    height: 40px;
    width: 100%;
    vertical-align: middle;
}

.select select {
    display: block;
    cursor: pointer;
    max-width: 100%;
    -moz-appearance: none; /* Firefox */
    -webkit-appearance: none; /* Safari and Chrome */
    appearance: none;
}

select::-ms-expand {
    display: none;
}

.select select:not([multiple]) {
    padding-right: 5px;
}

.select:not(.is-multiple):not(.is-loading)::after {
    border: 2px solid #333;
    border-radius: 2px;
    border-right: 0;
    border-top: 0;
    content: ' ';
    display: block;
    height: 6px;
    margin-top: -6px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
    transform-origin: center;
    width: 6px;
    right: 10px;
    z-index: 4;
}

/* 체크박스 */
.check-box{
    position: relative;
    min-height: 24px;
    font-size: 0;
    display: flex;
    align-items: center;
}

.check-box.small{
    min-height: 18px;
}

.check-box input[type="checkbox"] {
    display: inline-block;
    position: absolute;
    left: -9999px;
    opacity: 0;
    visibility: hidden;
    width: 1px;
    height: 1px;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    overflow: hidden;
}

.check-box label {
    position: relative;
    display: inline-block;
    padding-left: 30px;
    font-size: 16px;
    font-weight: 600;
    color: #777;
    cursor: pointer;
    line-height: 1.3;
}

.check-box.small label{
    font-size: 12px !important;
    padding-left:23px;
}

.check-box label:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 24px;
    height: 24px;
    box-sizing: border-box;
    margin-top: -12px;
    background-image: url(/img/svg/ico-check.svg);
}

.check-box.small label:before{
    width: 18px; height: 18px; margin-top:-9px;
}

.check-box input[type="checkbox"]:checked + label{
    color: var(--point-color);
}
.check-box input[type="checkbox"]:checked + label:before {
    background-image: url(/img/svg/ico-checked.svg);
}

/* 라디오버튼 */
.radio_box {
    position: relative;
}

.radio_box input[type="radio"] {
    display: inline-block;
    position: absolute;
    left: -9999px;
    opacity: 0;
    visibility: hidden;
    width: 1px;
    height: 1px;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    overflow: hidden;
}

.radio_box label {
    display: inline-block;
    padding-left: 30px;
    color: #333;
    cursor: pointer;
    position: relative;
    line-height: 24px;
}

.radio_box label:before {
    position: absolute;
    left: 0;
    top: 50%;
    width: 24px;
    height: 24px;
    box-sizing: border-box;
    border-radius: 12px;
    margin-top: -12px;
    border: 1px solid #cccccc;
    line-height: 20px;
    text-align: center;
    clear: both;
    content: '';
    display: block;
}

.radio_box label:after {
    position: absolute;
    content: '\2022';
    font-size: 30px;
    left: 6px;
    top: 0;
    line-height: 16px;
    font-weight: 500;
    display: none;
}

.radio_box input[type="radio"]:checked + label:after {
    display: block;
}

.swiper-wrapper {
    display: -webkit-box;
}


/* input type="file"*/
.fileBox {
    position: relative;
}

.fileBox .inputBox {
    float: left;
    box-sizing: border-box;
}

.fileBox input[type="text"] {
    float: left;
    overflow: hidden;
    box-sizing: border-box;
    height: 32px;
    padding: 8px 10px;
    border: 1px solid #cccccc;
    line-height: 1;
    background: #fafafa;
    box-sizing: border-box;
}

.fileBox .fileBtn {
    float: left;
    margin-left: 5px;
    box-sizing: border-box;
}

.fileBox .fileBtn label {
    display: inline-block;
    width: 110px;
    font-size: 14px;
    line-height: 40px;
    height: 40px;
    letter-spacing: -1px;
    color: #fff;
    background: #999;
    text-align: center;
    border-radius: 4px;
    box-sizing: border-box;
}

.fileBox .fileBtn input[type="file"] {
    visibility: hidden;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
}


.wid10 {
    width: 10%;
}

.wid20 {
    width: 20%;
}

.wid30 {
    width: 30%;
}

.wid40 {
    width: 40%;
}

.wid50 {
    width: 50%;
}

.wid60 {
    width: 60%;
}

.wid70 {
    width: 70%;
}

.wid80 {
    width: 80%;
}

.wid90 {
    width: 90%;
}

.wid100 {
    width: 100%;
}

.max100 {
    max-width: 100px;
}

.max150 {
    max-width: 150px;
}

.max200 {
    max-width: 200px;
}

.max250 {
    max-width: 250px;
}

.max300 {
    max-width: 300px;
}

.max350 {
    max-width: 350px;
}

.max400 {
    max-width: 400px;
}

.max450 {
    max-width: 450px;
}

.max500 {
    max-width: 500px;
}

.max550 {
    max-width: 550px;
}

.max600 {
    max-width: 600px;
}

.max650 {
    max-width: 650px;
}

.max700 {
    max-width: 700px;
}

.max750 {
    max-width: 750px;
}

.max800 {
    max-width: 800px;
}

.max850 {
    max-width: 850px;
}

.max900 {
    max-width: 900px;
}

.max950 {
    max-width: 950px;
}

.max1000 {
    max-width: 1000px;
}

.mt0 {
    margin-top: 0px !important;
}

.mt10 {
    margin-top: 10px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mt30 {
    margin-top: 30px !important;
}

.mt40 {
    margin-top: 40px !important;
}

.mt50 {
    margin-top: 50px !important;
}

.mt60 {
    margin-top: 60px !important;
}

.mt70 {
    margin-top: 70px !important;
}

.mt80 {
    margin-top: 80px !important;
}

.mt90 {
    margin-top: 90px !important;
}

.mt100 {
    margin-top: 100px !important;
}

.mb0 {
    margin-bottom: 0px !important;
}

.mb10 {
    margin-bottom: 10px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mb40 {
    margin-bottom: 40px !important;
}

.mb50 {
    margin-bottom: 50px !important;
}

.mb60 {
    margin-bottom: 60px !important;
}

.mb70 {
    margin-bottom: 70px !important;
}

.mb80 {
    margin-bottom: 80px !important;
}

.mb90 {
    margin-bottom: 90px !important;
}

.mb100 {
    margin-bottom: 100px !important;
}

.ml0 {
    margin-left: 0px !important;
}

.ml10 {
    margin-left: 10px !important;
}

.ml20 {
    margin-left: 20px !important;
}

.ml30 {
    margin-left: 30px !important;
}

.ml40 {
    margin-left: 40px !important;
}

.ml50 {
    margin-left: 50px !important;
}

.mr0 {
    margin-right: 0px !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mr20 {
    margin-right: 20px !important;
}

.mr30 {
    margin-right: 30px !important;
}

.mr40 {
    margin-right: 40px !important;
}

.mr50 {
    margin-right: 50px !important;
}

.pt10 {
    padding-top: 10px !important;
}

.pt20 {
    padding-top: 20px !important;
}

.pt30 {
    padding-top: 30px !important;
}

.pt40 {
    padding-top: 40px !important;
}

.pt50 {
    padding-top: 50px !important;
}

.pt60 {
    padding-top: 60px !important;
}

.pt70 {
    padding-top: 70px !important;
}

.pb10 {
    padding-bottom: 10px !important;
}

.pb20 {
    padding-bottom: 20px !important;
}

.pb30 {
    padding-bottom: 30px !important;
}

.pb40 {
    padding-bottom: 40px !important;
}

.pb50 {
    padding-bottom: 50px !important;
}

.pb60 {
    padding-bottom: 60px !important;
}

.pb70 {
    padding-bottom: 70px !important;
}


.auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.bno {
    border: none !important;
}

.blind {
    position: absolute;
    top: -999999px;
    width: 0;
    height: 0;
    font-size: 0;
    overflow: hidden;
}

.clear:after {
    clear: both;
    content: '';
    display: block;
}

.hidden {
    text-indent: -9999px;
    width: 0px;
    height: 0px;
    line-height: 0px;
    font-size: 0px;
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    overflow: hidden;
    visibility: hidden;
}


.fl_l {
    float: left !important;
}

.fl_r {
    float: right !important;
}


.wbreak {
    word-break: break-all !important;
}

.tb {
    display: table;
    width: 100%;
    height: 100%
}

.tbc {
    display: table-cell;
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.img {
}

.img img {
    max-width: 100%
}

.pic {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.pic img {
    width: 100%;
    max-width: 100%;
    height: auto;
    opacity: 0;
    visibility: hidden;
}

.inb{display: inline;}
.dpb{display: block;}

/* Font */
.ft12 {
    font-size: 12px !important;
}

.ft13 {
    font-size: 13px !important;
}

.ft14 {
    font-size: 14px !important;
}

.ft15 {
    font-size: 15px !important;
}

.ft16 {
    font-size: 16px !important;
}

.ft17 {
    font-size: 17px !important;
}

.ft18 {
    font-size: 18px !important;
}

.ft19 {
    font-size: 19px !important;
}

.ft20 {
    font-size: 20px !important;
}

.ft21 {
    font-size: 21px !important;
}

.ft22 {
    font-size: 22px !important;
}

.ft23 {
    font-size: 23px !important;
}

.ft24 {
    font-size: 24px !important;
}

.ft25 {
    font-size: 25px !important;
}

.ft26 {
    font-size: 26px !important;
}

.ft27 {
    font-size: 27px !important;
}

.ft28 {
    font-size: 28px !important;
}

.ft29 {
    font-size: 29px !important;
}

.ft30 {
    font-size: 30px !important;
}

.ft31 {
    font-size: 31px !important;
}

.ft32 {
    font-size: 32px !important;
}

.ft65 {
    font-size: 65px !important;
    letter-spacing: -4px;
    line-height: 60px;
}

.fs80 {
    font-size: 8rem;
}

.fs70 {
    font-size: 7rem;
}

.fs60 {
    font-size: 6rem;
}

.fs55 {
    font-size: 5.5rem;
}

.fs50 {
    font-size: 5rem;
}

.fs45 {
    font-size: 4.5rem;
}

.fs40 {
    font-size: 4rem;
}

.fs35 {
    font-size: 3.5rem;
}

.fs30 {
    font-size: 3rem;
}

.fs25 {
    font-size: 2.5rem;
}

.fs20 {
    font-size: 2rem;
}

.fs18 {
    font-size: 1.8rem;
}

.fs17 {
    font-size: 1.7rem;
}

.fs16 {
    font-size: 1.6rem;
}

.fs15 {
    font-size: 1.5rem;
}

.fs14 {
    font-size: 1.4rem;
}

.fs13 {
    font-size: 1.3rem;
}

.fs12 {
    font-size: 1.2rem;
}

.fs11 {
    font-size: 1.1rem;
}

.fs10 {
    font-size: 1rem;
}

.txt_l {
    text-align: left !important;
}

.txt_c {
    text-align: center !important;
}

.txt_r {
    text-align: right !important;
}

.ver_t {
    vertical-align: top !important;
}

.txt_b {
    font-weight: bold !important;
}

.txt_line {
    text-decoration: underline !important;
}

.txt_black {
    color: #000 !important;
}

.txt_white {
    color: #fff !important;
}

.fw200 {
    font-weight: 200 !important;
}

.fw300 {
    font-weight: 300 !important;
}

.fw400 {
    font-weight: 400 !important;
}

.fw500 {
    font-weight: 500 !important;
}

.fw600 {
    font-weight: 600 !important;
}

.fw800 {
    font-weight: 800 !important;
}

/* col width */
.col02 > * {
    width: 50% !important;
}

.col03 > * {
    width: 33.3333% !important;
}

.col04 > * {
    width: 25% !important;
}

.col05 > * {
    width: 20% !important;
}

.col06 > * {
    width: 16.6666% !important;
}

.col07 > * {
    width: 14.285% !important;
}

.col08 > * {
    width: 12.5% !important;
}

.col09 > * {
    width: 11.1111% !important;
}

.col10 > * {
    width: 10% !important;
}


/* animated */

.animate [class*='ani-'] {
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: alpha(opacity=100);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
}

.fromLeft:not(.done) {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    transform: translate3d(-50px, 0, 0);
    -webkit-transform: translate3d(-50px, 0, 0);
    -o-transform: translate3d(-50px, 0, 0);
    -ms-transform: translate3d(-50px, 0, 0);
    -moz-transform: translate3d(-50px, 0, 0);
}

.fromRight:not(.done) {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    transform: translate3d(50px, 0, 0);
    -webkit-transform: translate3d(50px, 0, 0);
    -o-transform: translate3d(50px, 0, 0);
    -ms-transform: translate3d(50px, 0, 0);
    -moz-transform: translate3d(50px, 0, 0);
}

.fromBottom:not(.done) {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    transform: translate3d(0, 100px, 0);
    -webkit-transform: translate3d(0, 100px, 0);
    -o-transform: translate3d(0, 100px, 0);
    -ms-transform: translate3d(0, 100px, 0);
    -moz-transform: translate3d(0, 100px, 0);
}

.fromTop:not(.done) {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    transform: translate3d(0, -100px, 0);
    -webkit-transform: translate3d(0, -100px, 0);
    -o-transform: translate3d(0, -100px, 0);
    -ms-transform: translate3d(0, -100px, 0);
    -moz-transform: translate3d(0, -100px, 0);
}

.fromCenter:not(.done) {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: alpha(opacity=0);
    transform: scale(0.8) translate3d(0, 0, 0);
    -webkit-transform: scale(0.8) translate3d(0, 0, 0);
    -o-transform: scale(0.8) translate3d(0, 0, 0);
    -ms-transform: scale(0.8) translate3d(0, 0, 0);
    -moz-transform: scale(0.8) translate3d(0, 0, 0);
}

.animate [class*='ani-'] {
    transition-property: transform, opacity;
    -webkit-transition-property: transform, opacity;
    transition-duration: 0.8s;
    -webkit-transition-duration: 0.8s;
    -o-transition-duration: .8s;
    -moz-transition-duration: .8s;
}

.animate.fast [class*='ani-'] {
    transition-duration: 0.6s;
    -webkit-transition-duration: 0.6s;
    -o-transition-duration: .6s;
    -moz-transition-duration: .6s;
}

.animate.slow [class*='ani-'] {
    transition-duration: 1s;
    -webkit-transition-duration: 1s;
    -o-transition-duration: 1s;
    -moz-transition-duration: 1s;
}

.animate .ani-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.animate .ani-2 {
    transition-delay: 160ms;
    -webkit-transition-delay: 160ms;
    -o-transition-delay: 160ms;
    -moz-transition-delay: 160ms;
}

.animate .ani-3 {
    transition-delay: 320ms;
    -webkit-transition-delay: 320ms;
    -o-transition-delay: 320ms;
    -moz-transition-delay: 320ms;
}

.animate .ani-4 {
    transition-delay: 480ms;
    -webkit-transition-delay: 480ms;
    -o-transition-delay: 480ms;
    -moz-transition-delay: 480ms;
}

.animate .ani-5 {
    transition-delay: 640ms;
    -webkit-transition-delay: 640ms;
    -o-transition-delay: 640ms;
    -moz-transition-delay: 640ms;
}

.animate .ani-6 {
    transition-delay: 800ms;
    -webkit-transition-delay: 800ms;
    -o-transition-delay: 800ms;
    -moz-transition-delay: 800ms;
}

.animate .ani-7 {
    transition-delay: 960ms;
    -webkit-transition-delay: 960ms;
    -o-transition-delay: 960ms;
    -moz-transition-delay: 960ms;
}

.aniamte .ani-8 {
    transition-delay: 1120ms;
    -webkit-transition-delay: 1120ms;
    -o-transition-delay: 1120ms;
    -moz-transition-delay: 1120ms;
}

.aniamte .ani-9 {
    transition-delay: 1280ms;
    -webkit-transition-delay: 1280ms;
    -o-transition-delay: 1280ms;
    -moz-transition-delay: 1280ms;
}

.animate .ani-10 {
    transition-delay: 1440ms;
    -webkit-transition-delay: 1440ms;
    -o-transition-delay: 1440ms;
    -moz-transition-delay: 1440ms;
}

.animate .ani-11 {
    transition-delay: 1600ms;
    -webkit-transition-delay: 1600ms;
    -o-transition-delay: 1600ms;
    -moz-transition-delay: 1600ms;
}

.fast.animate .ani-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.fast.animate .ani-2 {
    transition-delay: 140ms;
    -webkit-transition-delay: 140ms;
    -o-transition-delay: 140ms;
    -moz-transition-delay: 140ms;
}

.fast.animate .ani-3 {
    transition-delay: 270ms;
    -webkit-transition-delay: 270ms;
    -o-transition-delay: 270ms;
    -moz-transition-delay: 270ms;
}

.fast.animate .ani-4 {
    transition-delay: 400ms;
    -webkit-transition-delay: 400ms;
    -o-transition-delay: 400ms;
    -moz-transition-delay: 400ms;
}

.fast.animate .ani-5 {
    transition-delay: 530ms;
    -webkit-transition-delay: 530ms;
    -o-transition-delay: 530ms;
    -moz-transition-delay: 530ms;
}

.fast.animate .ani-6 {
    transition-delay: 660ms;
    -webkit-transition-delay: 660ms;
    -o-transition-delay: 660ms;
    -moz-transition-delay: 660ms;
}

.fast.animate .ani-7 {
    transition-delay: 790ms;
    -webkit-transition-delay: 790ms;
    -o-transition-delay: 790ms;
    -moz-transition-delay: 790ms;
}

.fast.animate .ani-8 {
    transition-delay: 920ms;
    -webkit-transition-delay: 920ms;
    -o-transition-delay: 920ms;
    -moz-transition-delay: 920ms;
}

.slow.animate .ani-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.slow.animate .ani-2 {
    transition-delay: 210ms;
    -webkit-transition-delay: 210ms;
    -o-transition-delay: 210ms;
    -moz-transition-delay: 210ms;
}

.slow.animate .ani-3 {
    transition-delay: 420ms;
    -webkit-transition-delay: 420ms;
    -o-transition-delay: 420ms;
    -moz-transition-delay: 420ms;
}

.slow.animate .ani-4 {
    transition-delay: 630ms;
    -webkit-transition-delay: 630ms;
    -o-transition-delay: 630ms;
    -moz-transition-delay: 630ms;
}

.slow.animate .ani-5 {
    transition-delay: 840ms;
    -webkit-transition-delay: 840ms;
    -o-transition-delay: 840ms;
    -moz-transition-delay: 840ms;
}

.slow.animate .ani-6 {
    transition-delay: 1050ms;
    -webkit-transition-delay: 1050ms;
    -o-transition-delay: 1050ms;
    -moz-transition-delay: 1050ms;
}

.slow.animate .ani-7 {
    transition-delay: 1260ms;
    -webkit-transition-delay: 1260ms;
    -o-transition-delay: 1260ms;
    -moz-transition-delay: 1260ms;
}

.slow.animate .ani-8 {
    transition-delay: 1470ms;
    -webkit-transition-delay: 1470ms;
    -o-transition-delay: 1470ms;
    -moz-transition-delay: 1470ms;
}

.scale [class*='sc-'] {
    transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    transition-property: transform;
    -webkit-transition-property: transform;
    -o-transition-property: transform;
    -moz-transition-property: transform;
    transition-duration: 0.8s;
    -webkit-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
}

.scale .fromSc9:not(.done) {
    transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -o-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -moz-transform: scale(0.9);
}

.scale .fromSc8:not(.done) {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -moz-transform: scale(0.8);
}

.scale .fromSc7:not(.done) {
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -o-transform: scale(0.7);
    -ms-transform: scale(0.7);
    -moz-transform: scale(0.7);
}

.scale .fromSc6:not(.done) {
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    -o-transform: scale(0.6);
    -ms-transform: scale(0.6);
    -moz-transform: scale(0.6);
}

.scale .fromSc5:not(.done) {
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    -o-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -moz-transform: scale(0.5);
}

.scale .fromSc11:not(.done) {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
}

.scale .fromSc12:not(.done) {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -moz-transform: scale(1.2);
}

.scale .fromSc13:not(.done) {
    transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -moz-transform: scale(1.3);
}

.scale .fromSc14:not(.done) {
    transform: scale(1.4);
    -webkit-transform: scale(1.4);
    -o-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -moz-transform: scale(1.4);
}

.scale .fromSc15:not(.done) {
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
    -o-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -moz-transform: scale(1.5);
}

.scale .sc-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.scale .sc-2 {
    transition-delay: 160ms;
    -webkit-transition-delay: 160ms;
    -o-transition-delay: 160ms;
    -moz-transition-delay: 160ms;
}

.scale .sc-3 {
    transition-delay: 320ms;
    -webkit-transition-delay: 320ms;
    -o-transition-delay: 320ms;
    -moz-transition-delay: 320ms;
}

.scale .sc-4 {
    transition-delay: 480ms;
    -webkit-transition-delay: 480ms;
    -o-transition-delay: 480ms;
    -moz-transition-delay: 480ms;
}

.scale .sc-5 {
    transition-delay: 640ms;
    -webkit-transition-delay: 640ms;
    -o-transition-delay: 640ms;
    -moz-transition-delay: 640ms;
}

.scale .sc-6 {
    transition-delay: 800ms;
    -webkit-transition-delay: 800ms;
    -o-transition-delay: 800ms;
    -moz-transition-delay: 800ms;
}

.scale .sc-7 {
    transition-delay: 960ms;
    -webkit-transition-delay: 960ms;
    -o-transition-delay: 960ms;
    -moz-transition-delay: 960ms;
}

.scale .sc-8 {
    transition-delay: 1120ms;
    -webkit-transition-delay: 1120ms;
    -o-transition-delay: 1120ms;
    -moz-transition-delay: 1120ms;
}

.fast.scale .sc-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.fast.scale .sc-2 {
    transition-delay: 140ms;
    -webkit-transition-delay: 140ms;
    -o-transition-delay: 140ms;
    -moz-transition-delay: 140ms;
}

.fast.scale .sc-3 {
    transition-delay: 270ms;
    -webkit-transition-delay: 270ms;
    -o-transition-delay: 270ms;
    -moz-transition-delay: 270ms;
}

.fast.scale .sc-4 {
    transition-delay: 400ms;
    -webkit-transition-delay: 400ms;
    -o-transition-delay: 400ms;
    -moz-transition-delay: 400ms;
}

.fast.scale .sc-5 {
    transition-delay: 530ms;
    -webkit-transition-delay: 530ms;
    -o-transition-delay: 530ms;
    -moz-transition-delay: 530ms;
}

.fast.scale .sc-6 {
    transition-delay: 660ms;
    -webkit-transition-delay: 660ms;
    -o-transition-delay: 660ms;
    -moz-transition-delay: 660ms;
}

.fast.scale .sc-7 {
    transition-delay: 790ms;
    -webkit-transition-delay: 790ms;
    -o-transition-delay: 790ms;
    -moz-transition-delay: 790ms;
}

.fast.scale .sc-8 {
    transition-delay: 920ms;
    -webkit-transition-delay: 920ms;
    -o-transition-delay: 920ms;
    -moz-transition-delay: 920ms;
}


.slow.scale .sc-1 {
    transition-delay: 10ms;
    -webkit-transition-delay: 10ms;
    -o-transition-delay: 10ms;
    -moz-transition-delay: 10ms;
}

.slow.scale .sc-2 {
    transition-delay: 210ms;
    -webkit-transition-delay: 210ms;
    -o-transition-delay: 210ms;
    -moz-transition-delay: 210ms;
}

.slow.scale .sc-3 {
    transition-delay: 420ms;
    -webkit-transition-delay: 420ms;
    -o-transition-delay: 420ms;
    -moz-transition-delay: 420ms;
}

.slow.scale .sc-4 {
    transition-delay: 630ms;
    -webkit-transition-delay: 630ms;
    -o-transition-delay: 630ms;
    -moz-transition-delay: 630ms;
}

.slow.scale .sc-5 {
    transition-delay: 840ms;
    -webkit-transition-delay: 840ms;
    -o-transition-delay: 840ms;
    -moz-transition-delay: 840ms;
}

.slow.scale .sc-6 {
    transition-delay: 1050ms;
    -webkit-transition-delay: 1050ms;
    -o-transition-delay: 1050ms;
    -moz-transition-delay: 1050ms;
}

.slow.scale .sc-7 {
    transition-delay: 1260ms;
    -webkit-transition-delay: 1260ms;
    -o-transition-delay: 1260ms;
    -moz-transition-delay: 1260ms;
}

.slow.scale .sc-8 {
    transition-delay: 1470ms;
    -webkit-transition-delay: 1470ms;
    -o-transition-delay: 1470ms;
    -moz-transition-delay: 1470ms;
}


.vertical-i {
    animation: vb 1s infinite;
}

@keyframes vb {
    0% {
        bottom: 0;
    }
    50% {
        bottom: 10px;
    }
    100% {
        bottom: 0px;
    }
}

@keyframes vt {
    0% {
        top: 0;
    }
    50% {
        top: 10px;
    }
    100% {
        top: 0;
    }
}
@charset "utf-8";
#main .main-bg{height: 480px; background-image: url(/img/main-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%;}

#main .condition-search{margin-top: -163px;}
#main .main-banner{margin-top: 140px;}
#main .main-banner-swiper{position:relative; overflow: hidden;}
#main .main-banner-swiper .swiper-slide{position:relative; border-radius: 10px; overflow: hidden;}
#main .main-banner-swiper .swiper-slide .pic.pcta img{height: 240px;}
#main .main-banner-swiper .swiper-slide .txt{position:absolute; left:0; top:0; width: 100%; height: 100%;}
#main .main-banner-swiper .swiper-slide .txt .inner{align-items: flex-start; gap:20px; padding:20px; max-width: 1080px; height: 100%; margin: 0 auto; box-sizing: border-box;}
#main .main-banner-swiper .swiper-slide .txt .big em{display: block; font-size: 3.4rem; font-weight: 800; line-height: 1.2;}
#main .main-banner-swiper .swiper-slide .txt.wh .big em{color: #fff;}

#main .main-banner-swiper .swiper-slide .txt .small{line-height: 1.4;}
#main .main-banner-swiper .swiper-slide .txt .small p{font-size: 1.8rem; color: #333;}
#main .main-banner-swiper .swiper-slide .txt.wh  .small p{color: rgba(255, 255, 255, 0.60);}

#main .main-banner-swiper .swiper-util{position:absolute; right:20px; bottom:20px; z-index: 10;}
#main .main-banner-swiper .swiper-util .inner{gap:20px; padding:8px 25px; border-radius: 15px; background-color: rgba(0, 0, 0, 0.50);}

#main .main-banner-swiper .swiper-util .banner-fraction p{font-size: 14px; font-weight: 700; line-height: 1; color: rgba(255,255,255,0.7);}
#main .main-banner-swiper .swiper-util .banner-fraction p .current{color: #fff;}
#main .main-banner-swiper .swiper-util .arrow{gap: 10px;}
#main .main-banner-swiper .swiper-util .arrow button{font-size: 0;}
#main .main-banner-swiper .swiper-util .arrow [class ^="banner-button"]:hover path{fill-opacity: 1;}
#main .main-banner-swiper .swiper-util .arrow .banner-play-pause{width: 8px;}

#main .sec-tit{text-align: center;}
#main .sec-tit h2{font-size: 3.6rem; font-weight: 800; line-height: 1.2;}
#main .tit-link{text-align: left;}
#main .tit-link h2 a{position:relative; display: inline-block; padding-right: 41px;}
#main .tit-link h2 a:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-18px; width: 36px; height: 36px; background-image: url(/img/svg/ico-tit-link.svg);}
#main .sec-con{margin-top: 40px;}
#main .btn-more{margin-top: 60px;}
#main .btn-more > a{display: block; max-width: 280px; margin:0 auto; padding: 0 30px; height: 70px; line-height: 70px; border-radius: 10px; background-color: var(--point-color); transition: all 0.2s linear; box-sizing: border-box;}
#main .btn-more > a:hover{box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);}
#main .btn-more > a span{position:relative; display: block; font-weight: 800; color: #fff; padding-right: 16px;}
#main .btn-more > a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-8px; width: 16px; height: 16px; background-image: url(/img/svg/ico-btn-more.svg);}

#main .section1{margin-top: 80px;}
#main .section2{margin-top: 80px;}
#main .section3{margin: 100px 0;}
#main .section3 .review-list > ul{flex-wrap: wrap; margin: -10px;}
#main .section3 .review-list > ul > li{width:33.3333%; padding:10px; box-sizing: border-box;}
#main .section3 .review-list > ul > li .inner{display: block; padding:40px 30px 30px; border-radius: 10px; border: 1px solid #f1f1f1; background-color: #fff;}
#main .section3 .review-swiper > ul > li .inner{display: block; padding: 20px; border-radius: 10px; border: 1px solid #f1f1f1; background-color: #fff;}

#main .section3 .review-list .top{padding-bottom: 20px;}
#main .section3 .review-list .top .star-rating .name{display: block; font-size: 14px; color: #999; line-height: 1;}

#main .section3 .review-list .top .txt-wrap{margin-top: 15px;}
#main .section3 .review-list .top .txt-wrap .title em{height:26px; font-size: 20px; font-weight: 800; line-height: 1.2;}
#main .section3 .review-list .top .txt-wrap .content{margin-top: 6px;}
#main .section3 .review-list .top .txt-wrap .content p{height:72px; -webkit-line-clamp:3; font-size: 16px; font-weight: 500; line-height: 1.5; color: #666;}
#main .section3 .review-list .top .course{margin-top: 10px;}
#main .section3 .review-list .top .course i{display: inline-block; padding: 8px 10px; font-size: 12px; font-weight: 700; color: var(--point-color); line-height: 1; border-radius: 5px; background-color: rgba(29,110,48,0.1);}

#main .section3 .review-list .btm{padding-top:20px; border-top: 1px solid #d9d9d9;}
#main .section3 .review-list .btm .img-list > ul{gap: 9px;}
#main .section3 .review-list .btm .img-list .img{border: 1px solid rgba(241, 241, 241, 0.95); border-radius: 5px;}

#main .section3 .review-list .btm .btn-link{margin-top: 20px;}
#main .section3 .review-list .btm .btn-link > a{display: block; height: 60px; line-height: 60px; border-radius: 5px; background-color: #ececec; text-align: center; font-size: 1.6rem; font-weight: 700; color: #666;}
#main .section3 .review-list .btm .btn-link > a:hover{color: #fff;}

#main .section4{padding: 100px 0 80px; background-color: #f2eadd;}
#main .section4 .book-list > ul > li .inner{padding-top:20px;}
#main .section4 .book-list > ul > li a{position: relative; top:0;}
#main .section4 .book-list > ul > li:hover a{top: -20px;}

/* sub */
#sub{padding-top: 80px;}

#sub .sub-visual{height: 442px; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%;}
#sub .sub-visual .txt-wrap{padding-top: 100px;}
#sub .sub-title .txt-wrap{padding: 100px 0 80px;}

#sub .dot-title h2{font-size: 5rem; font-weight: 800; line-height: 1;}
#sub .dot-title h2 span{position: relative; display: inline-block; padding-right: 17px;}
#sub .dot-title h2 span:before{content:''; display: block; position:absolute; right:0; bottom:0; width: 12px; height: 12px; border-radius: 100%; background-color: var(--point-color);}

#sub .sub-visual .sub-refer{margin-top: 75px;}
#sub .sub-visual .sub-refer em{display: block; font-size: 3.2rem; font-weight: 700; line-height: 1.2;}
#sub .sub-visual .sub-refer p{margin-top:15px; font-size: 1.6rem; font-weight: 400; line-height: 1.3; color: #666;}

#sub .sub-title .sub-refer{margin-top: 25px;}
#sub .sub-title .sub-refer p{font-size: 2rem; line-height: 1.3; color: #333;}

/* hr */
#sub.hr .sub-visual .sub-refer{margin-top: 50px;}
#sub.hr .sec-wrap{padding: 120px 0 160px;}
#sub.hr .condition-search{margin-top: -116px;}
#sub.hr .pagination{margin-top: 50px;}

/* enterprise */
#sub.enterprise .sec-wrap{padding-bottom: 180px;}
#sub.enterprise .sub-title .sub-refer p{font-size: 2.2rem;}
#sub.enterprise .pagination{margin-top: 50px;}

/* view */
#sub.view .sub-wrap{padding:100px 0 160px;}
#sub.view:has(.sub-title) .sub-wrap{padding-top: 0;}
#sub.view .sec-wrap > .size{position: relative;}
#sub.view .left{width: 100%; padding-right: 395px; box-sizing: border-box;}

#sub.view .top-banner{position: relative; border-radius: 10px; overflow: hidden;}
#sub.view .top-banner .swiper-util > button{position:absolute; top:50%; display:block; z-index: 5;}
#sub.view .img-swiper .swiper-util > button{width:58px; height:160px; margin-top:-80px;}
#sub.view .img-swiper-mo .swiper-util > button{width:30px; height:84px; margin-top:-42px;}
#sub.view .top-banner .swiper-util > button.prev{left:0;}
#sub.view .top-banner .swiper-util > button.next{right:0;}

#sub.view .left .tab-wrap{margin-top: 20px;}
#sub.view .left .tab-tit{border-bottom: 1px solid #ececec; background-color: #fff;}
#sub.view .left .tab-tit.sticky{position: -webkit-sticky; position: sticky; top:0; z-index: 15;}
#sub.view .left .tab-tit ul{gap: 40px;}
#sub.view .left .tab-tit ul li{height: 54px; line-height: 54px;}
#sub.view .left .tab-tit ul li a{position:relative; display: block; font-weight:600; color: #999; transition: color 0.2s linear;}
#sub.view .left .tab-tit ul li.on a{color: var(--point-color);}
#sub.view .left .tab-tit ul li a:before{opacity: 0; content:''; display: block; position: absolute; left: 0; bottom:0; width: 100%; height:3px; background-color: var(--point-color); transition: opacity 0.2s linear;}
#sub.view .left .tab-tit ul li.on a:before{opacity: 1;}

#sub.view .left .tab-con{padding: 40px 0 80px;}
#sub.view .left .tab-con > section{margin-top: 60px;}
#sub.view .left .tab-con > section:first-of-type{margin-top:0;}
#sub.view section .sec-tit i{display: block; font-size: 1.4rem; font-weight: 600; color: #d0d0d0; line-height: 1; margin-bottom: 5px;}
#sub.view section .sec-tit strong{display: block; font-size: 3rem; font-weight: 700; color: #111; line-height: 1.2;}
#sub.view section .sec-con{margin-top: 20px;}

#sub.view .left .tab-con > section.section-intro .inner-box{padding-bottom: 20px;}
#sub.view .left .section-intro .top{padding-bottom: 20px;}
#sub.view .left .section-intro .top .title em{display: block; font-size:16px; font-weight: 700; color: #333; line-height: 1.3;}
#sub.view .left .section-intro .top .content{margin-top: 5px;}
#sub.view .left .section-intro .top .content p{font-size: 14px; color: #666; line-height: 1.5;}

#sub.view .left .section-intro .btm{padding-top: 20px; border-top: 1px solid #ececec;}
#sub.view .left .section-intro .btm .tag-list ul{gap: 10px; flex-wrap: wrap;}
#sub.view .left .section-intro .btm .tag-list li{padding: 13px 20px; border-radius: 19px; border: 1px solid var(--point-color); font-size: 12px; font-weight: 600; color: var(--point-color); line-height: 1;}

#sub.view .left .section-table .sec-tit .row-left{gap: 8px;}
#sub.view .left .section-table .sec-tit .total{font-size:1.6rem; font-weight: 600; color: var(--point-color);}
#sub.view .left .section-table .table-box > ul{border-radius: 10px; border: 1px solid #ececec; background-color: rgba(29, 110, 48, 0.03); overflow: hidden;}
#sub.view .left .section-table .table-box > ul > li{display: flex; border-top: 1px solid #ececec;}
#sub.view .left .section-table .table-box > ul > li:first-of-type{border-top: none;}
#sub.view .left .section-table .table-box .list-tit{width: 136px; border-right: 1px solid #ececec; box-sizing: border-box;}
#sub.view .left .section-table .table-box .list-tit .block{display: block; margin:0 auto; width: 46px; height: 26px;line-height: 26px; border-radius: 5px; background-color: var(--point-color); font-size: 12px; font-weight: 600; color: #fff; text-align: center;}
#sub.view .left .section-table .table-box .list-tit .txt{margin-top:12px; line-height: 1; text-align: center;}
#sub.view .left .section-table .table-box .list-tit .txt .hour{display: block; font-size: 2.4rem; font-weight: 700; }
#sub.view .left .section-table .table-box .list-tit .txt .type{display: block; font-size: 13px; font-weight: 500; color: #666; margin-top: 6px;}

#sub.view .left .section-table .table-box .list-con{width: 100%;}
#sub.view .left .section-table .table-box .list-con > .inner{padding: 30px; background-color: #fff;}
#sub.view .left .section-table .table-box .list-con .col-tit{padding-bottom: 10px; border-bottom: 1px solid #ececec;}
#sub.view .left .section-table .table-box .list-con .col-tit strong{display: block; font-size: 2rem; font-weight: 700; line-height: 1.2;}
#sub.view .left .section-table .table-box .list-con .col-con{margin-top: 25px;}
#sub.view .left .section-table .table-box .list-con .col-con .num-list > ul > li{margin-top: 13px;}
#sub.view .left .section-table .table-box .list-con .col-con .num-list > ul > li:first-of-type{margin-top:0;}
#sub.view .left .section-table .table-box .list-con .col-con .num-list .num-tit em{display: block; font-size: 16px; font-weight: 700; color: #333; line-height: 1.3;}
#sub.view .left .section-table .table-box .list-con .col-con .num-list .num-tit em span{color: var(--point-color);}

#sub.view .left .section-table .table-box .list-con .col-con .num-list .num-con{margin-top: 5px;}
#sub.view .left .section-table .table-box .list-con .col-con .num-list .num-con ul li{position:relative; /* padding-left:8px; */ font-size: 14px; color: #666;}
/* #sub.view .left .section-table .table-box .list-con .col-con .num-list .num-con ul li:before{content:''; display: block; position:absolute; left:0; top:10px; width:4px; height:1px; background-color: #666;} */

#sub.view .left .section-table .table-box .list-con .col-con .txt-box{margin-top: 20px;}
#sub.view .left .section-table .table-box .list-con .col-con .txt-box .inner{padding: 30px; background-color: #f8f8f8; border: 1px solid #ececec; border-radius: 10px;}
#sub.view .left .section-table .table-box .list-con .col-con .txt-box p{margin-top:8px; font-size: 14px; color: #666; line-height: 1.4;}
#sub.view .left .section-table .table-box .list-con .col-con .txt-box p:first-of-type{margin-top:0;}

#sub.view .left .section-label .label-box > ul > li{gap: 15px; margin-top: 20px;}
#sub.view .left .section-label .label-box > ul > li:first-of-type{margin-top:0;}
#sub.view .left .section-label .label-box > ul > li:has(ul){align-items: flex-start;}
#sub.view .left .section-label .label-box .list-tit{flex: none; width: 130px;}
#sub.view .left .section-label .label-box .list-tit b{display: block; height: 50px; line-height: 50px; border-radius: 25px; background-color: var(--point-color); font-weight: 700; color: #fff; text-align: center;}
#sub.view .left .section-label .label-box .list-con{width:100%; padding:10px 0; color: #333; line-height: 1.3;}
#sub.view .left .section-label .label-box .list-con ul li{position:relative; padding-left:10px; margin-top: 7px;}
#sub.view .left .section-label .label-box .list-con ul li:first-of-type{margin-top: 0;}
#sub.view .left .section-label .label-box .list-con ul li:before{content:''; display: block; position:absolute; left:0; top:8px; width:5px; height:1px; background-color: #333;}

#sub.view .left .section-instructor .swiper-slide .inner-box{gap: 30px; align-items: flex-start;}
#sub.view .left .section-instructor .img-wrap{max-width:294px; flex: none;}
#sub.view .left .section-instructor .img-wrap .img{border-radius: 10px; overflow: hidden;}
#sub.view .left .section-instructor .txt-wrap .txt-tit i{display: block; font-size: 14px; font-weight: 600; color: var(--point-color); line-height:1;}
#sub.view .left .section-instructor .txt-wrap .txt-tit p{margin-top:8px; font-size: 2.4rem; font-weight: 400; color: #333; line-height: 1.2;}
#sub.view .left .section-instructor .txt-wrap .txt-tit p b{font-weight: 700;}

#sub.view .left .section-instructor .txt-wrap .txt-con{margin-top: 25px;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box{margin-top:18px;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box:first-of-type{margin-top:0;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box-tit b{display: block; font-size: 16px; font-weight: 700; line-height: 1; color: #333;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box-content{margin-top:10px;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box-content ul li{position:relative; padding-left:8px; font-size: 14px; color: #666; line-height: 1.5;}
#sub.view .left .section-instructor .txt-wrap .txt-con .box-content ul li:before{content:''; display: block; position:absolute; left:0; top:9px; width:4px; height:1px; background-color: #666;}
#sub.view .left .section-instructor .mo-pagination{display: none;}

#sub.view .left .tab-con > section.section-youtube{margin-top:0; overflow: hidden;}
#sub.view .left .tab-con > section.section-youtube .swiper-slide{margin-top:20px;}
#sub.view .left .tab-con > section.section-youtube .swiper-slide:has(.empty){margin-top: 0 !important;}
#sub.view .left .tab-con > section.section-youtube .empty{text-indent: -99999px; height: 1px;}

#sub.view .left .section-review .stats-wrap{gap: 10px;}
#sub.view .left .section-review .stats-wrap .star-avg{width: 222px; flex: none;}
#sub.view .left .section-review .stats-wrap .star-avg .inner{height:180px; gap:10px; padding: 45px; box-sizing: border-box; border-radius: 10px; border: 1px solid #ececec; line-height: 1;}
#sub.view .left .section-review .stats-wrap .star-avg .avg{display: block; font-size: 3.4rem; font-weight: 700; color: #000;}
#sub.view .left .section-review .stats-wrap .star-avg p{font-size: 1.5rem; font-weight: 600; color: #b7b7b7;}

#sub.view .left .section-review .stats-wrap .score-ratio{width: 100%;}
#sub.view .left .section-review .stats-wrap .score-ratio .inner{height:180px; padding: 30px; box-sizing: border-box; border-radius: 10px; border: 1px solid #ececec;}
#sub.view .left .section-review .stats-wrap .score-ratio ul{width: 100%;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li{display: flex; justify-content: left; align-items: center; gap: 10px; margin-top:10px;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li:first-of-type{margin-top:0;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li .score{display: block; font-size: 1.5rem; font-weight: 600; line-height: 1; color: #333;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li .progress-bar{position:relative; width:100%; height: 8px; border-radius: 4px; background-color: #dee2e6;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li .progress-bar span{position:absolute; display:block; left:0; top:0; height:100%; border-radius:4px; background-color: #868e96;}
#sub.view .left .section-review .stats-wrap .score-ratio ul li .progress-bar.high span{background-color: #ffb400;}

#sub.view .left .section-review .review-list{margin-top: 20px;}
#sub.view .left .section-review .review-list > ul{padding:0 30px;}
#sub.view .left .section-review .review-list > ul > li{border-top: 1px solid #ececec;}
#sub.view .left .section-review .review-list > ul > li:first-of-type{border-top: none;}
#sub.view .left .section-review .review-list .list-tit{width:102px; padding:10px; flex: none; text-align: center; box-sizing: border-box;}
#sub.view .left .section-review .review-list .list-tit .name{display: block; font-weight: 700; color: #333;}

#sub.view .left .section-review .review-list .list-con{width: 100%; padding: 20px; padding-right: 0; box-sizing: border-box;}
#sub.view .left .section-review .review-list .list-con .txt-wrap{margin-top: 15px;}
#sub.view .left .section-review .review-list .list-con .txt-wrap .title em{display: block; font-size:16px; font-weight: 700; line-height: 1.2;}
#sub.view .left .section-review .review-list .list-con .txt-wrap .content{margin-top: 10px;}
#sub.view .left .section-review .review-list .list-con .txt-wrap .content p{font-size: 14px; color: #999; line-height: 1.5;}
#sub.view .left .section-review .review-list .list-con .util{margin-top: 20px; align-items: flex-start;}
#sub.view .left .section-review .review-list .list-con .util .date p{position:relative; padding-left:23px; font-size: 14px; font-weight: 600; color: #666; line-height: 1;}
#sub.view .left .section-review .review-list .list-con .util .date p:before{content:''; display: block; position:absolute; left:0; top:50%; margin-top:-9px; width:18px; height:18px; background-image:url(/img/svg/ico-calendar.svg);}

#sub.view .left .section-review .review-list .list-con .util .btn-box{gap: 5px;}
#sub.view .left .section-review .review-list .list-con .util .btn-box button{display: block; width: 51px; height: 25px; border-radius: 5px; font-size: 12px; font-weight: 600;}
#sub.view .left .section-review .review-list .list-con .util .btn-box .btn-edit{background-color: #111; color: #fff;}
#sub.view .left .section-review .review-list .list-con .util .btn-box .btn-delete{background-color: #ececec; color: #666;}

#sub.view .left .section-review .review-list .list-con .img-list{margin-top: 25px;}
#sub.view .left .section-review .review-list .list-con .img-list > ul{gap: 10px;}
#sub.view .left .section-review .review-list .list-con .img-list .img{border-radius: 5px; overflow: hidden; border: 1px solid #f1f1f1;}

#sub.view .left .section-review .pagination{margin-top: 40px;}

#sub.view .left .tab-con > section.section-write:has(.form-wrap) .inner-box{padding: 30px 25px;}
#sub.view .left .section-write .btn-star button{font-size: 0;}
#sub.view .left .section-write .btn-star button img{width: 28px;}
#sub.view .left .section-write .login-check{text-align: center;}
#sub.view .left .tab-con > section.section-write:has(.login-check) .inner-box{padding: 50px 30px;}
#sub.view .left .section-write .login-check .title em{display: block; font-size: 2.2rem; font-weight: 700; line-height: 1.3;}
#sub.view .left .section-write .login-check .content{margin-top: 30px; gap: 10px;}
#sub.view .left .section-write .login-check .content [class ^="btn-"] a{display: block; width: 180px; height: 60px; line-height: 58px; border-radius: 30px; font-weight: 700;}
#sub.view .left .section-write .login-check .content .btn-login a{border: 1px solid var(--point-color);}

#sub.view .left .section-notice .notice-box .box{margin-top: 25px;}
#sub.view .left .section-notice .notice-box .box:first-of-type{margin-top:0;}
#sub.view .left .section-notice .notice-box .box .box-tit em{display: block; font-size: 16px; font-weight: 700; color: var(--point-color); line-height: 1.2;}
#sub.view .left .section-notice .notice-box .box .box-con{margin-top: 10px;}
#sub.view .left .section-notice .notice-box .box .box-con .inner{padding: 20px; border-radius: 10px; background-color: #f8f8f8; border: 1px solid #ececec;}
#sub.view .left .section-notice .notice-box .box .box-con .check-list ul li{position:relative; padding-left:20px; font-size: 1.5rem; color: #333;}
#sub.view .left .section-notice .notice-box .box .box-con .check-list ul li:before{content:''; display: block; position:absolute; left:0; top:6px; width:12px; height:9px; background-image: url(/img/svg/ico-check-list.svg);}
#sub.view .left .section-notice .notice-box .box .box-con p{font-size: 1.5rem; color: #333; line-height: 1.5;}

/* #sub.view .right{position:relative; width: 100%; max-width: 355px; flex: none; padding-bottom: 80px;} */
#sub.view .right{position:absolute; width: 355px; right: 20px; top: 0; bottom: 80px;}
#sub.view .right .top-banner{display: none;}
#sub.view .right .sticky-wrap{position: -webkit-sticky; position: sticky; top:100px; transition: top 0.2s linear;}
#sub.view .right.top .sticky-wrap{top:0;}
#sub.view .right .sticky-wrap > .inner{padding: 20px; border: 1px solid #ececec; border-radius: 10px; background-color: #fff; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);}
#sub.view .right .sticky-wrap .top{padding-bottom: 20px;}
#sub.view .right .sticky-wrap .top .on-off-line span{display: inline-block; padding:11px 19px; border-radius: 17px; background-color: var(--point-color); font-size: 12px; font-weight: 700; color: #fff; line-height: 1;}
#sub.view .right .sticky-wrap.close .top .on-off-line span{background-color: #b7b7b7;}
#sub.view .right .sticky-wrap .top .title{margin-top: 15px;}
#sub.view .right .sticky-wrap .top .title strong{display: block; font-size: 2rem; font-weight: 800; line-height: 1.2;}
#sub.view .right .sticky-wrap.close .top .title strong{color: #555;}
#sub.view .right .sticky-wrap .top .title p{margin-top:7px; font-size: 14px; line-height: 1.3;}
#sub.view .right .sticky-wrap.close .top .title p{color: #999;}

#sub.view .right .sticky-wrap .mid{padding-top: 20px; border-top: 1px solid #ececec;}
#sub.view .right .sticky-wrap .mid .box{margin-top: 20px;}
#sub.view .right .sticky-wrap .mid .box:first-of-type{margin-top: 0;}
#sub.view .right .sticky-wrap .mid .box-tit em{display: block; font-size: 14px; font-weight: 700; color: var(--point-color); line-height: 1.2;}
#sub.view .right .sticky-wrap.close .mid .box-tit em{color: #555;}
#sub.view .right .sticky-wrap .mid .info-list{margin-top: 10px;}
#sub.view .right .sticky-wrap .mid .info-list .inner{padding: 20px; border-radius: 10px; border: 1px solid #ececec; background-color: #f8f8f8;}
#sub.view .right .sticky-wrap .mid .info-list ul{margin:-15px 0;}
#sub.view .right .sticky-wrap .mid .info-list ul li{font-size: 14px; padding:15px 0; border-top:1px solid #ececec;}
#sub.view .right .sticky-wrap .mid .info-list ul li:first-of-type{border-top: 0;}
#sub.view .right .sticky-wrap .mid .info-list .list-tit b{position:relative; display: block; padding-left: 11px; font-weight: 700; color: #777; line-height: 1;}
#sub.view .right .sticky-wrap .mid .info-list .list-tit b:before{content:''; display: block; position:absolute; left:0; top:50%; margin-top:-3px; width:6px; height:6px; border-radius: 100%; background-color: var(--point-color);}
#sub.view .right .sticky-wrap.close .mid .info-list .list-tit b:before{background-color: #999;}
#sub.view .right .sticky-wrap .mid .info-list .list-con{margin-top: 5px;}
#sub.view .right .sticky-wrap .mid .info-list .list-con p{font-weight: 600; line-height: 1.3;}
#sub.view .right .sticky-wrap.close .mid .info-list .list-con p{color: #555;}
#sub.view .right .mid .price{margin-top: 20px; text-align: right; line-height: 100%;}
#sub.view .right .mid .price p{font-size: 20px; color: var(--point-color);}
#sub.view .right .sticky-wrap.close .mid .price p{color: #666;}
#sub.view .right .mid .price strong{display: inline-block; font-size: 26px; font-weight: 800;}

#sub.view .right .sticky-wrap .btm{margin-top: 30px;}
#sub.view .right .sticky-wrap .btm a{display: block; height: 50px; border-radius: 10px; font-size: 14px; font-weight: 700; box-sizing: border-box; text-align: center;}
#sub.view .btn-download > a{line-height: 48px; border: 1px solid var(--point-color); background-color: #fff; color: var(--point-color);}
#sub.view .btn-download > a span{position:relative; display: inline-block; padding-right:18px;}
#sub.view .btn-download > a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-6px; width:13px; height:12px; background-image: url(/img/svg/ico-download.svg);}
#sub.view .right .sticky-wrap .btm .btn-row{margin-top: 7px; gap: 7px;}
#sub.view .right .sticky-wrap .btm .btn-row a{color: #fff; line-height: 50px;}
#sub.view .right .sticky-wrap .btm .btn-row .btn-apply{width: 100%;}
#sub.view .right .sticky-wrap .btm .btn-row .btn-apply > a{background-color: var(--point-color);}
#sub.view .right .sticky-wrap.close .btm .btn-row .btn-apply > a{background-color: #8c8c8c;}
#sub.view .right .sticky-wrap .btm .btn-row .btn-share{width:89px; flex:none;}
#sub.view .btn-share> a{background-color: #111;}
#sub.view .btn-share> a span{position:relative; display: inline-block; padding-right:15px;}
#sub.view .btn-share> a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-6px; width:10px; height:12px; background-image: url(/img/svg/ico-share.svg);}

#sub.view .section-recommend{overflow: hidden;}

#sub.view .section-fixed{display:none; position:fixed; left: 0; bottom: 0; width: 100%; padding:10px 0; z-index: 100; background-color: #fff; box-shadow: 0px -4px 18px 0px rgba(0, 0, 0, 0.08);}
#sub.view .section-fixed .size{gap: 7px;}
#sub.view .section-fixed .btn-apply{width: 100%;}
#sub.view .section-fixed .btn-apply > a{display: block; width: 100%; height: 50px; line-height: 50px; border-radius: 10px; font-size: 14px; font-weight: 700; text-align: center;}
#sub.view .section-fixed .btn-more{width: 100px; flex: none;} 
#sub.view .section-fixed .btn-more > a{display: block; width: 100%; height: 50px; line-height: 50px; border-radius: 10px; font-size: 14px; font-weight: 700; text-align: center; color: #fff; background-color: #111;}
#sub.view .section-fixed .btn-more > a span{position: relative; display: inline-block; padding-right: 15px;}
#sub.view .section-fixed .btn-more > a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-5px; width: 11px; height: 10px; background-image: url(/img/svg/ico-btn-more-popup.svg);}

#sub.view .popup-more{position: fixed; left: 0; bottom:-207px; width: 100%; z-index: 120;}
#sub.view .popup-more .inner{padding: 20px; padding-top:0; border-radius: 20px 20px 0 0; background-color: #fff;}
#sub.view .popup-more.open .inner{box-shadow: 0px -4px 18px 0px rgba(0, 0, 0, 0.08);}
#sub.view .popup-more .top{position: relative; text-align: center; border-bottom: 1px solid #ececec;}
#sub.view .popup-more .top .btn-more-close{position:absolute; left:0; top:50%; margin-top: -7px; font-size: 0;}
#sub.view .popup-more .top .more-tit strong{display: block; font-size: 18px; font-weight: 700; line-height: 60px;}
#sub.view .popup-more .btm{padding-top: 20px;}
#sub.view .popup-more .btm a{display: block; height:50px; border-radius: 10px; font-size: 14px; font-weight: 700; box-sizing: border-box; text-align: center;}

#sub.view .popup-more .btm .btn-share{margin-top: 6px;}
#sub.view .popup-more .btm .btn-share a{line-height: 50px; color: #fff;}

/* view-apply */
#sub.view-apply .left > section{margin-top: 20px;}
#sub.view-apply .left > section:first-of-type{margin-top:0;}

#sub.view-apply .right .buyer-wrap .inner-box{padding: 30px 20px 20px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}
#sub.view-apply .right .buyer-wrap .top .title em{display: block; font-size: 2rem; font-weight: 800; line-height: 1.2;}
#sub.view-apply .right .buyer-wrap .mid{margin-top: 25px;}
#sub.view-apply .right .buyer-wrap .mid .form-row{margin-top: 15px;}

#sub.view-apply .right .buyer-wrap .btm{margin-top: 30px;}
#sub.view-apply .right .buyer-wrap .btm .row-cen{gap: 7px;}
#sub.view-apply .right .buyer-wrap .btm .row-cen > div{width: 100%;}
#sub.view-apply .right .buyer-wrap .btm a,
#sub.view-apply .right .buyer-wrap .btm button{display: block; width: 100%; height: 50px; line-height: 48px; text-align: center; font-size: 14px; font-weight: 700; color: #fff; border-radius: 10px;}
#sub.view-apply .right .buyer-wrap .btm .btn-naverpay a{background-color: #111;}
#sub.view-apply .right .buyer-wrap .btm .btn-card a{border: 1px solid #111; color: #111;}
#sub.view-apply .right .buyer-wrap .btm .btn-row{margin-top: 7px;}
#sub.view-apply .right .buyer-wrap .btm .btn-payment button[type="submit"]{background-color: var(--point-color);}

/* bookinsight */
#sub.bookinsight .sec-wrap{padding-bottom: 160px;}
#sub.bookinsight .book-list > ul > li a:hover{border: 1px solid var(--point-color); box-shadow: 0px 0px 25px 0px rgba(29, 110, 48, 0.20);}

/* project */
#sub.project .title i{display: block; font-size: 1.8rem; font-weight: 600; color: var(--point-color); line-height: 100%;}
#sub.project .title .big{margin-top: 15px;}
#sub.project .title .big h3{display: block; font-size: 3.6rem; font-weight: 700; line-height: 1.3;}
#sub.project .content{margin-top: 35px;}
#sub.project .content p{margin-top:20px; font-size: 1.8rem; font-weight: 400; color: #333; line-height: 1.5;}
#sub.project .content p:first-of-type{margin-top: 0;}

#sub.project .section1{padding-bottom: 120px;}
#sub.project .section1 .box-wrap{gap: 30px; align-items: flex-start;}
#sub.project .section1 .box-wrap > div{width: 100%;}
#sub.project .section1 .sub-tit p{font-size: 2.6rem; font-weight: 400; line-height: 1.3;}
#sub.project .section1 .sub-tit p b{display:inline-block; font-weight: 700;}

#sub.project .section2{padding: 120px 0; background-color: rgba(29, 110, 48, 0.05);}
#sub.project .section2 .box-wrap{gap:60px; margin-top: 60px;}
#sub.project .section2 .box-wrap:first-of-type{margin-top: 0; flex-direction: row-reverse;}
#sub.project .section2 .txt-wrap{width: 645px;}
#sub.project .section2 .img-wrap{width: 675px;}
#sub.project .section2 .content{margin-top: 55px;}
#sub.project .section2 .content P{margin-top: 32px;}

/* introduce */
#sub.introduce [class ^="section"]{padding: 120px 0;}
#sub.introduce .sec-tit i:not(.dpb):not(.inb){display: block; margin-bottom:5px; font-size: 2rem; font-weight: 500; color: var(--point-color); line-height: 1;}
#sub.introduce .sec-tit .big h3{display: block; font-size: 4.6rem; font-weight: 700; line-height: 1.3; letter-spacing:-0.8px;}
#sub.introduce .sec-tit p{display: block; margin-top:20px; font-size: 2.6rem; font-weight: 400; line-height: 1.3; letter-spacing:-0.8px;}
#sub.introduce .sec-tit p b{display:inline-block; font-weight: 700;}

#sub.introduce .img-wrap{flex: none;}
#sub.introduce .txt-wrap .title em{display: block; font-size: 3.6rem; font-weight: 700; line-height: 1.2;}
#sub.introduce .txt-wrap .content{margin-top: 50px;}
#sub.introduce .txt-wrap .content p{margin-top:20px; font-size: 1.8rem; font-weight: 400; color: #333;}
#sub.introduce .txt-wrap .content p:first-of-type{margin-top:0 !important;}

#sub.introduce .section1{background-color: #f3f7f4;}
#sub.introduce .section1 .sec-con{gap: 60px; flex-direction: row-reverse;}

#sub.introduce .section2 .sec-con{gap: 20px; margin-top: 70px;}
#sub.introduce .section2 .txt-wrap{text-align: right;}
#sub.introduce .section2 .txt-wrap .title em{color: rgba(102,102,102,0.38);}
#sub.introduce .section2 .txt-wrap .content{margin-top: 0;}

#sub.introduce .section3{padding-bottom:150px; background-color: #f8f8f8;}
#sub.introduce .section3 .sec-con{align-items: flex-start; gap: 40px;}
#sub.introduce .section3 .box{margin-top: 50px;}
#sub.introduce .section3 .box .box-tit p{font-size: 2.6rem; line-height: 1.4; color: #111;}
#sub.introduce .section3 .box .box-tit p b{display: inline-block; font-weight: 700;}
#sub.introduce .section3 .box .box-con{margin-top:25px;}
#sub.introduce .section3 .img-wrap{position:relative; z-index: 3; flex: auto;}
#sub.introduce .section3 .img-wrap .img{margin-bottom: -270px;}

#sub.introduce .section4{position:relative; background-image: url(/img/sub-introduce-img-bg.jpg); background-size:cover; background-position:50% 50%; background-repeat:no-repeat; z-index: 1;}
#sub.introduce .section4:before{content:''; display: block; position:absolute; left:0; top:0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.74); z-index: -1;}
#sub.introduce .section4 .sec-tit i{font-size: 2.2rem; color: rgba(255,255,255,0.7);}
#sub.introduce .section4 .sec-tit .big{margin-top:10px;}
#sub.introduce .section4 .sec-tit .big h3{color: #fff;}
#sub.introduce .section4 .sec-con{margin-top: 100px; justify-content: left; gap: 50px;}
#sub.introduce .section4 .txt-wrap .title em{color: #fff;}
#sub.introduce .section4 .txt-wrap .title em span{display:inline-block; font-weight: 400;}
#sub.introduce .section4 .txt-wrap .content{margin-top: 30px;}
#sub.introduce .section4 .txt-wrap .content p{color: rgba(255,255,255,0.8);}

#sub.introduce .section5{padding-bottom: 160px;}
#sub.introduce .section5 .sec-tit{text-align: center; color: #333;}
#sub.introduce .section5 .sec-tit span{display: block; font-size: 2.8rem; font-weight: 400; line-height: 1.3;}
#sub.introduce .section5 .sec-tit h3{margin-top:10px; font-size: 4rem; font-weight: 700; line-height: 1.2;}
#sub.introduce .section5 .sec-con{margin-top: 80px;}
#sub.introduce .section5 .btn-list{gap: 20px;}
#sub.introduce .section5 .btn-list a{width: 160px; height: 160px; gap:14px; border-radius: 100%; box-sizing: border-box; transition: all 0.2s linear;}
#sub.introduce .section5 .btn-list .btn-gr a{background-color: var(--point-color);}
#sub.introduce .section5 .btn-list .btn-gr a:hover{box-shadow: 0px 0px 20px 0px rgba(29, 110, 48, 0.20);}
#sub.introduce .section5 .btn-list .btn-wh a{border: 1px solid var(--point-color); background-color: #fff;}
#sub.introduce .section5 .btn-list .btn-wh a:hover{box-shadow: 0px 0px 15px 0px rgba(29, 110, 48, 0.10);}
#sub.introduce .section5 .btn-list .btn-bk a{background-color: #111;}
#sub.introduce .section5 .btn-list .btn-bk a:hover{box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.20);}
#sub.introduce .section5 .btn-list a b{display: block; font-size: 1.8rem; font-weight: 700; line-height: 1; color: #fff;}
#sub.introduce .section5 .btn-list .btn-wh a b{color: var(--point-color);}

/* inquiry */
#sub.inquiry .sec-wrap{padding-bottom: 160px;}

#sub.inquiry .table-wrap .num{width: 100px;}
#sub.inquiry .table-wrap .type{width: 11%;}
#sub.inquiry .table-wrap .title{width: calc(100% - 31% - 220px);}
#sub.inquiry .table-wrap .date{width: 10%;}
#sub.inquiry .table-wrap .name{width: 10%;}
#sub.inquiry .table-wrap .answer{width: 120px;}
#sub.inquiry .table-wrap .answer > a{display: block; margin:0 auto; width: 75px; height: 34px; line-height: 34px; padding: 0 16px; border-radius:5px; background-color: #111; box-sizing: border-box; cursor: pointer;}
#sub.inquiry .table-wrap .answer > a span{position:relative; display: block; padding-right:18px; font-size:14px; font-weight:600; color:#fff;}
#sub.inquiry .table-wrap .answer > a span:before{content:''; display: block; position:absolute; right:0; top:50%; margin-top:-7px; width:15px; height:14px; background-image:url(/img/svg/ico-answer.svg);}

/* inquiry-idx */
#sub.inquiry-idx .form-wrap{padding: 80px; border: 1px solid #f1f1f1; border-radius: 10px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}
#sub.inquiry-idx .form-wrap .form-row:has(.col){gap: 20px;}
#sub.inquiry-idx .form-same{margin:30px 0 15px;}
#sub.inquiry-idx .form-same + .form-row{margin-top:0;}
#sub.inquiry-idx .form-same .form-label{justify-content: right;}
#sub.inquiry-idx .textarea textarea{min-height: 280px;}
#sub.inquiry-idx .btn-wrap{gap: 10px;}

/* mypage */
#sub.mypage .sec-wrap{padding-bottom: 160px;}
#sub.mypage .sec-wrap > .row-end{gap: 50px; align-items: flex-start;}
#sub.mypage .nav-wrap{width: 300px; flex: none;}
#sub.mypage .nav-wrap > a{display:none; position:relative; height: 60px; line-height: 58px; padding: 0 20px; font-size: 14px; font-weight: 600; color: var(--point-color); border: 1px solid var(--point-color); border-radius: 10px; background-color: #f3f7f4; box-sizing: border-box;}
#sub.mypage .nav-wrap > a:before{content:''; display: block; position:absolute; right:20px; top:50%; margin-top:-3px; width:11px; height: 6px; background-image: url(/img/svg/ico-check-drop-down.svg);}
#sub.mypage .nav-wrap > a.on:before{background-image: url(/img/svg/ico-check-drop-up.svg);}
#sub.mypage .nav-wrap ul li{margin-top: 10px;}
#sub.mypage .nav-wrap ul li:first-of-type{margin-top: 0;}
#sub.mypage .nav-wrap ul li a{gap: 10px; height: 60px; padding: 22px 20px; border: 1px solid #f1f1f1; border-radius: 8px; box-sizing: border-box; background-color: #fff; transition: all 0.2s linear;}
#sub.mypage .nav-wrap ul li.on a{border: 1px solid var(--point-color); background-color: rgba(29, 110, 48, 0.05);}
#sub.mypage .nav-wrap ul li a span{display: block; font-weight: 600; color: #666; transition: color 0.2s linear;}
#sub.mypage .nav-wrap ul li a:hover span{color: #111;}
#sub.mypage .nav-wrap ul li.on a span{color: var(--point-color);}
#sub.mypage .nav-wrap ul li a svg{flex: none;}
#sub.mypage .nav-wrap ul li a:hover svg path{stroke: #111;}
#sub.mypage .nav-wrap ul li.on a svg path{stroke: var(--point-color);}

#sub.mypage .content-wrap{width: 100%;}
#sub.mypage .content-wrap .cont-tit h3{font-size: 3.6rem; font-weight: 700; line-height: 1.2;}
#sub.mypage .content-wrap .cont-box{margin-top: 40px;}
#sub.mypage .form-wrap .form-box{padding: 80px 80px 60px; border: 1px solid #f1f1f1; border-radius: 10px; background-color: #fff;}

/* favorite */
#sub.favorite .box-list > ul:not(.swiper-wrapper) > li{width: 33.3333%;}

/* mypage-inquiry */
#sub.mypage.inquiry .search-wrap{border: 1px solid #e8e8e8; border-radius: 5px; background-color: #f8f8f8;}
#sub.mypage.inquiry .search-wrap .search-tit{width: 180px; padding: 15px; background-color: #e8e8e8; flex: none; align-self:stretch; box-sizing: border-box;}
#sub.mypage.inquiry .search-wrap .top .search-tit{border-bottom: 1px solid #fff;}
#sub.mypage.inquiry .search-wrap .search-tit b{display: block; font-size: 14px; font-weight: 700; color: var(--point-color);}
#sub.mypage.inquiry .search-wrap .search-con{padding: 5px; gap: 5px; width: 100%; box-sizing: border-box;}
#sub.mypage.inquiry .search-wrap .top .search-con{border-bottom: 1px solid #e8e8e8;}

#sub.mypage.inquiry .search-wrap .condition{gap: 5px; width: 100%;}

#sub.mypage.inquiry .search-wrap .input input[type="text"]{height: 50px; padding: 0 15px; border: 1px solid #e8e8e8; border-radius: 5px; font-size: 14px;}
#sub.mypage.inquiry .search-wrap .input input[type="text"]::placeholder{font-size: 14px;}
#sub.mypage.inquiry .search-wrap .calendar-box .mid-dash{width: 20px; font-size: 1.4rem; color: #444; text-align: center; flex: none;}
#sub.mypage.inquiry .search-wrap .calendar-box .input-date{width: 100%;}
#sub.mypage.inquiry .search-wrap .btn-month{gap: 3px;}
#sub.mypage.inquiry .search-wrap .btn-month button{display: block; margin:0 auto; width: 50px; height: 50px; border-radius: 5px; background-color: #b7b7b7; font-size: 14px; font-weight: 700; color: #fff; transition: all 0.2s linear;}
#sub.mypage.inquiry .search-wrap .btn-month button:hover,
#sub.mypage.inquiry .search-wrap .btn-month button.on{background-color: var(--point-color); color: #fff;}

#sub.mypage.inquiry .search-wrap .board-select{max-width: 168px;}
#sub.mypage.inquiry .search-wrap .board-select > a{border-radius: 5px; border: 1px solid #e8e8e8;}
#sub.mypage.inquiry .search-wrap .board-select > a.on{border-radius: 5px 5px 0 0;}
#sub.mypage.inquiry .search-wrap .board-select > ul{border: 1px solid #e8e8e8; border-radius: 0 0 5px 5px;}
#sub.mypage.inquiry .search-wrap .board-select + .input{width: 100%;}
#sub.mypage.inquiry .search-wrap .top .btn-wrap{width: 318px; flex: none; gap: 4px;}
#sub.mypage.inquiry .search-wrap .btn-submit button[type="submit"]{display: block; margin: 0 auto; width: 158px; height: 50px; border-radius: 5px; font-size: 14px; font-weight: 700;}

#sub.mypage.inquiry .form-wrap .btn-reset{margin-top: 20px;}
#sub.mypage.inquiry .form-wrap .btn-reset button[type="button"]{display: block; margin: 0 auto; width: 160px; height: 50px; border-radius: 5px; background-color: #111; font-size: 14px; font-weight: 700; color: #fff;}

#sub.mypage.inquiry .table-wrap{margin-top: 40px;}
#sub.mypage.inquiry .table-wrap .num{width: 80px;}
#sub.mypage.inquiry .table-wrap .type{width: 15%;}
#sub.mypage.inquiry .table-wrap .title{width: calc(100% - 28% - 200px);}
#sub.mypage.inquiry .table-wrap .date{width: 13%;}
#sub.mypage.inquiry .table-wrap .answer{width: 120px;}
#sub.mypage.inquiry .btn-btm{margin-top: 60px;}

/* request */
#sub.request .tab-tit > ul{gap: 10px;}
#sub.request .tab-tit > ul > li{width: 100%;}
#sub.request .tab-tit > ul > li > a{display: block; height: 70px; line-height: 68px; border: 1px solid #ececec; border-radius: 10px; background-color: #f8f8f8; font-weight: 700; color: #999; text-align: center;}
#sub.request .tab-tit > ul > li.on > a{border: 1px solid var(--point-color); background-color: var(--point-color); color: #fff;}
#sub.request .status-list{margin-top: 30px;}
#sub.request .status-list > ul{gap: 40px; border-bottom: 1px solid #ececec;}
#sub.request .status-list > ul > li > a{position:relative; display: block; padding-bottom: 19px; font-weight: 600; color: #999; line-height: 1; transition: all 0.2s linear;}
#sub.request .status-list > ul > li > a:hover{color: #111;}
#sub.request .status-list > ul > li.on > a{color: var(--point-color);}
#sub.request .status-list > ul > li.on > a:before{content:''; display: block; position:absolute; left:0; bottom:-1px; width: 100%; height: 3px; background-color: var(--point-color);}

#sub.request .table-wrap{margin-top: 50px;}
#sub.request .table-wrap .table-top{text-align: left;}
#sub.request .table-wrap .table-top em{display: block; font-size: 1.8rem; font-weight: 700; line-height: 1.2;}
#sub.request .table-wrap .table-box{margin-top: 15px;}

#sub.request .table-wrap .width-wrap{width: calc(100% - 120px); padding: 0;}
#sub.request .table-wrap .width-wrap > div{box-sizing: border-box;}

#sub.request .table-wrap .lecture-infor{width: calc(100% - 44%); flex: none;}
#sub.request .table-wrap .table-body .lecture-infor{padding: 25px;}
#sub.request .table-wrap .lecture-type{width: 10%;}
#sub.request .table-wrap .table-body .lecture-type{padding: 10px;}
#sub.request .table-wrap .apply-date{width: 14%;}
#sub.request .table-wrap .table-body .apply-date{padding: 10px;}
#sub.request .table-wrap .apply-infor{width: 20%;}
#sub.request .table-wrap .table-body .apply-infor{padding: 10px;}

#sub.request .table-wrap .status{width: 120px; gap: 5px; padding: 10px 25px;}

#sub.request .table-wrap .table-body > ul > li{height: auto;}
#sub.request .table-wrap .status span,
#sub.request .table-wrap .status button{display: block; margin: 0 auto; width: 68px; height: 34px; line-height: 34px; font-size: 12px; font-weight: 700; color: #fff; border-radius: 5px;}

#sub.request .table-wrap .status span.receipt{line-height:32px; border: 1px solid var(--point-color); color: var(--point-color);}
#sub.request .table-wrap .status span.proceed{background-color: var(--point-color);}
#sub.request .table-wrap .status span.wait{background-color: #666;}
#sub.request .table-wrap .status span.complete{background-color: #111;}
#sub.request .table-wrap .status span.cancel{background-color: #b61010;}

#sub.request .table-wrap .status .btn-cancel{background-color: #ececec; color: #666;}

/* request-view */
#sub.request-view .cont-box > section{margin-top: 60px;}
#sub.request-view .cont-box > section:first-of-type{margin-top: 0;}
#sub.request-view .sec-tit h4{font-size: 2.4rem; font-weight: 700; line-height: 1.2;}
#sub.request-view .sec-con{margin-top: 12px;}

#sub.request-view .block-list ul li.row{gap: 10px; border: none; border-radius: 0;}
#sub.request-view .block-list ul li.row .col{border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden;}

#sub.request-view .section-step .sec-con > .inner-box{padding: 30px 25px 25px;}
#sub.request-view .section-step .step-list > ul{margin: 0 -34px;}
#sub.request-view .section-step .step-list > ul > li{position:relative; width: 25%; padding: 0 34px; color: #666; line-height: 1;}
#sub.request-view .section-step .step-list > ul > li:before{content:''; display: block; position:absolute; left:-6.5px; top:50%; margin-top:-11px; width:13px; height:22px; background-image: url(/img/svg/ico-arr-step.svg);}
#sub.request-view .section-step .step-list > ul > li.on:before,
#sub.request-view .section-step .step-list > ul > li.prev:before{background-image: url(/img/svg/ico-arr-step-on.svg);}
#sub.request-view .section-step .step-list > ul > li:first-of-type:before{display: none;}
#sub.request-view .section-step .step-list > ul > li.on{color: #fff;}
#sub.request-view .section-step .step-list > ul > li.prev{color: var(--point-color);}
#sub.request-view .section-step .step-list > ul > li .inner{align-items: flex-start; gap:6px; padding:0 30px; height: 74px; border-radius: 37px; background-color: #ececec; box-sizing: border-box;}
#sub.request-view .section-step .step-list > ul > li.on .inner{background-color: var(--point-color);}
#sub.request-view .section-step .step-list > ul > li.prev .inner{border: 1px solid var(--point-color); background-color: #fff;}
#sub.request-view .section-step .step-list > ul > li i{display: block; font-size: 1.4rem; font-weight: 600;}
#sub.request-view .section-step .step-list > ul > li b{display: block; font-size: 1.8rem; font-weight: 700;}
#sub.request-view .section-step .box-wrap{margin-top: 40px;}
#sub.request-view .section-step .box-wrap > .box{margin-top: 40px;}
#sub.request-view .section-step .box-wrap > .box:first-of-type{margin-top:0;}
#sub.request-view .section-step .box-tit em{display: block; font-size: 1.8rem; font-weight: 700; color: var(--point-color); line-height: 1.3;}
#sub.request-view .section-step .box-con{margin-top: 15px;}

#sub.request-view .section-step .box-img .inner-box{padding: 50px 25px; text-align: center;}
#sub.request-view .section-step .box-img .txt{margin-top: 20px;}
#sub.request-view .section-step .box-img .txt p{font-size: 1.8rem; font-weight: 700; line-height: 1.4;}

#sub.request-view .section-step .memo-wrap > ul > li{margin-top: 25px;}
#sub.request-view .section-step .memo-wrap > ul > li:first-of-type{margin-top: 0;}
#sub.request-view .section-step .memo-wrap .date{text-align: right; line-height: 1;}
#sub.request-view .section-step .memo-wrap .date p{position:relative; display: inline-block; padding-left:23px; font-size: 14px; font-weight: 600; color: #666;}
#sub.request-view .section-step .memo-wrap .date p:before{content:''; display: block; position:absolute; left:0; top:50%; margin-top:-9px; width:18px; height:18px; background-image: url(/img/svg/ico-calendar.svg);}
#sub.request-view .section-step .memo-wrap .content{margin-top: 10px;}
#sub.request-view .section-step .memo-wrap .content .inner{min-height:140px; padding: 20px; border-radius: 10px; border: 1px solid #ececec; background-color: #f8f8f8; box-sizing: border-box;}
#sub.request-view .section-step .memo-wrap .content p{color: #333; line-height: 1.4;}

#sub.request-view .block-list + .price-total{margin-top: 10px;}
#sub.request-view .price-total{line-height: 1.1;}
#sub.request-view .price-total .inner-box{height: 100px;}
#sub.request-view .price-total b{display: block; font-weight: 700;}
#sub.request-view .price-total .col-cen{gap: 5px; align-items: flex-end;}
#sub.request-view .price-total .amount{font-size: 20px; color: var(--point-color);}
#sub.request-view .price-total .amount strong{display: inline-block; font-size: 26px; font-weight: 800;}
#sub.request-view .price-total .date{display: block; font-size: 13px; font-weight: 500; color: #666;}

#sub.request-view .section-step .payment-list .inner-box{background-color: #f8f8f8;}
#sub.request-view .section-step .payment-list .check-label-list ul{gap: 5px; margin: 0;}
#sub.request-view .section-step .payment-list .check-label-list ul li{width: auto; padding: 0;}
#sub.request-view .section-step .payment-list .check-label-list ul li input[type="radio"] + label{padding:0 10px; width: 148px; height: 50px; line-height: 48px; border-radius: 10px; border: 1px solid #111; color: #111; font-size: 1.4rem; background-color: #fff;}
#sub.request-view .section-step .payment-list .check-label-list ul li input[type="radio"] + label:hover,
#sub.request-view .section-step .payment-list .check-label-list ul li input[type="radio"]:checked + label{background-color: #111; color: #fff;}

/* request-enterprise */
#sub.request-enterprise .preview{flex-wrap: wrap; row-gap: 10px;}
#sub.request-enterprise .preview .txt-wrap .content-wrap{gap: 40px; row-gap: 0; flex-wrap: wrap;}


#sub.request-enterprise .preview-wrap + .block-list{margin-top: 20px;}
#sub.request-enterprise .block-list + .price-total{margin-top: 20px;}

#sub.request-enterprise .block-list ul li .list-tit .require{position:relative; display: inline-block; padding-right: 10px;}
#sub.request-enterprise .block-list ul li .list-tit .require:before{content: "*"; display: block; position: absolute; right: 0; top: 0; color: #ea0000;}
#sub.request-enterprise .block-list ul li .list-con p.red{color: #ea0000;}

#sub.request-enterprise .guide-wrap .inner-box{padding: 20px; background-color: #f8f8f8;}
#sub.request-enterprise .guide-wrap p{font-size: 1.5rem; color: #333; line-height: 1.4;}

/* search */
#sub.search .sec-wrap{padding-bottom: 160px;}
#sub.search .result-wrap{margin-top:80px;}
#sub.search .result-wrap:first-of-type{margin-top:0;}
#sub.search .result-wrap .result-top{margin-bottom: 15px;}
#sub.search .result-wrap .result-top p{font-size: 1.8rem; font-weight: 600; line-height: 1.2;}

/* member */
#sub.member .sec-wrap{padding: 120px 0 160px;}
#sub.member .member-inner{padding: 80px 120px; border-radius: 10px; border: 1px solid #f1f1f1; background-color: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);}

#sub.member .sec-tit{text-align: center;}
#sub.member .sec-tit h2{font-size: 3.6rem; font-weight: 700; line-height: 1.2;}
#sub.member .sec-tit p{margin-top:5px; font-size:16px; color: #666; line-height: 1.3;}
#sub.member .sec-con{margin-top: 40px;}

#sub.member .login-input .input{margin-top: 10px;}
#sub.member .login-input .input:first-of-type{margin-top:0;}
#sub.member .login-input .input input{height: 60px; transition: all 0.2s linear;}
#sub.member .login-input .input input:hover{border: 1px solid var(--point-color);}

#sub.member [class ^="btn-"] > a,
#sub.member [class ^="btn-"] > button{display: block; margin: 0 auto; width: 100%; height: 65px; line-height: 65px; border-radius: 10px; font-size:1.6rem; font-weight: 800; text-align: center; transition: all 0.2s linear;}
#sub.member .btn-gr button:hover{box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);}
#sub.member .btn-join a:hover{box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);}

/* login */
#sub.login .sec-wrap > .size{display: flex; gap: 30px;}
#sub.login .login-wrap{width: 100%;}

#sub.login .login-util{margin-top: 15px; row-gap:10px; flex-wrap: wrap;}
#sub.login .login-util .check-box label{line-height: 100%;}
#sub.login .login-util .find-box > ul{gap: 21px;}
#sub.login .login-util .find-box > ul > li{position:relative;}
#sub.login .login-util .find-box > ul > li:before{content:''; display: block; position:absolute; left:-11px; top:50%; margin-top:-7px; width:1px; height:14px; background-color: rgba(204, 204, 204, 0.87);}
#sub.login .login-util .find-box > ul > li:first-of-type:before{display: none;}
#sub.login .login-util .find-box a{display: block; font-size: 14px; color: #000;}
#sub.login .btn-login{margin-top: 30px;}

#sub.login .join-wrap{width: 100%; text-align: center;}
#sub.login .join-wrap .txt-wrap .title{margin-top: 35px;}
#sub.login .join-wrap .txt-wrap .title em{display: block; font-size: 2.2rem; font-weight: 800; line-height: 1.2;}
#sub.login .join-wrap .txt-wrap .content{margin-top: 10px;}
#sub.login .join-wrap .txt-wrap .content p{font-weight: 400; color: #666; line-height: 1.4;}
#sub.login .join-wrap .btn-join{margin-top: 50px;}

/* idpwsearch */
#sub.idpwsearch .size{max-width: 715px;}
#sub.idpwsearch .find-tab > ul{border-radius: 10px; overflow: hidden;}
#sub.idpwsearch .find-tab > ul > li{width: 100%;}
#sub.idpwsearch .find-tab a{display: block; height: 70px; line-height: 68px; text-align: center; font-size:16px; font-weight: 700; color: #999; background-color: #f8f8f8; border: 1px solid #ececec;}
#sub.idpwsearch .find-tab a.on{background-color: var(--point-color); border: 1px solid var(--point-color); color: #fff;}

#sub.idpwsearch .find-wrap{margin-top: 20px;}
#sub.idpwsearch .find-box{display: none;}
#sub.idpwsearch .find-box.on{display: block;}
#sub.idpwsearch .find-box .btn-find{margin-top: 20px;}

#sub.idpwsearch .join-box{margin-top: 60px;}
#sub.idpwsearch .join-box p{font-size: 14px; font-weight: 600; line-height: 1.3;}
#sub.idpwsearch .btn-join{margin-top:8px;}
#sub.idpwsearch .btn-join > a{background-color: #111; color: #fff;}

#sub.idpwsearch .result-box .inner{height:120px; border-radius: 10px; background-color: #f8f8f8; text-align: center;}
#sub.idpwsearch .result-box p{font-weight: 600; line-height: 1.4;}
#sub.result .btn-btm{margin-top: 20px;}
#sub.result .btn-btm > div{width: 100%;}

/* join */
#sub.join .check-all .check-box{display: block; text-align: center;}
#sub.join .check-all .check-box label{display:block; padding: 20px; border-radius: 10px; background-color: #ececec; box-sizing: border-box;} 
#sub.join .check-all .check-box label:before{left:20px; width:30px; height:30px; margin-top:-15px;}
#sub.join .check-all .check-box input[type="checkbox"]:checked + label{background-color: rgba(29, 110, 48, 0.05);}
#sub.join .check-all .check-box input[type="checkbox"]:checked + label:before{background-image: url(/img/svg/ico-checked-full.svg);}

#sub.join .check-list ul li{margin-top: 10px;}
#sub.join .check-list ul li .inner{position:relative; padding:22px 20px; border-radius: 10px; border: 1px solid #ececec; background-color: #fff; box-sizing: border-box;}
#sub.join .check-list ul li .check-box input[type="checkbox"]:checked + label{color: #111;}
#sub.join .check-list ul li button{display: block; position:absolute; right:0; width:50px; height: 100%;}

#sub.join .btn-btm button{width: 220px; height: 70px; border-radius: 35px;}
@charset "utf-8";


#ui-datepicker-div {
    display: none;
    background-color: #fff;
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.1);
    margin-top: 0.25rem;
    border-radius: 0.5rem;
    padding: 1rem;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.ui-datepicker-calendar thead th {
    padding: 0.25rem 0;
    text-align: center;
    font-size: 1.4rem;
    font-weight: 400;
    color: #78909C;
    font-family: 'Roboto', 'Noto Sans KR', sans-serif;
}

.ui-datepicker-calendar tbody td {
    width: 3.5rem;
    text-align: center;
    padding: 0;
}

.ui-datepicker-calendar tbody td a {
    display: block;
    border-radius: 0.25rem;
    line-height: 3rem;
    transition: 0.3s all;
    color: #546E7A;
    font-size: 1.5rem;
    text-decoration: none;
    font-family: 'Roboto', 'Noto Sans KR', sans-serif;
}

.ui-datepicker-calendar tbody td a:hover {
    background-color: #E0F2F1;
}

.ui-datepicker-calendar tbody td a.ui-state-active {
    background-color: #009688;
    color: white;
}

.ui-datepicker-header a.ui-corner-all {
    cursor: pointer;
    position: absolute;
    top: 0;
    width: 4rem;
    height: 4rem;
    margin: 0.5rem;
    border-radius: 0.25rem;
    transition: 0.3s all;
}

.ui-datepicker-header a.ui-corner-all:hover {
    background-color: #ECEFF1;
}

.ui-datepicker-header a.ui-datepicker-prev {
    left: 0;
    background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==");
    background-repeat: no-repeat;
    background-size: 1.3rem;
    background-position: 50%;
    transform: rotate(180deg);
}

.ui-datepicker-header a.ui-datepicker-next {
    right: 0;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==');
    background-repeat: no-repeat;
    background-size: 1.3rem;
    background-position: 50%;
}

.ui-datepicker-header a > span {
    display: none;
}

.ui-datepicker-title {
    text-align: center;
    line-height: 3rem;
    margin-bottom: 0.25rem;
    font-size: 1.5rem;
    font-weight: 500;
    padding-bottom: 0.25rem;
}

.ui-datepicker-week-col {
    color: #78909C;
    font-weight: 400;
    font-size: 0.75rem;
}
@charset "utf-8";
/* CSS Document */

.program_menu{width:100%; position:relative; height:100%; overflow:hidden; background:#000; color:#fff;}
.program_menu h1{font-size:2.0rem; font-weight:800; text-align:center; padding:10px;}
.program_menu h1 img{width:100%;}

.program_menu  .m { cursor: pointer; }/*마우스 모양*/
.program_menu  .s { display: none; }/*처음엔 보여주지 않기*/

.program_menu ul{width:100%;}
.program_menu > ul > li{width:100%; background:#333; color:#fff; padding:10px; text-indent:10px;  line-height:30px; border-bottom:1px solid #666;}
.program_menu > ul > li > ul > li{padding:1px 0; line-height:20px; border-bottom:none;}
.program_menu > ul > li > ul > li a{width:100%; background:#999;  padding:5px 5px; color:#333; display:block;}
.program_menu > ul > li > ul > li a:hover{background:#36e4e6; color:#333; font-weight:bold;}

.program{margin:30px; min-height:100%;}
.program h2.title{font-size:2.0rem; padding:10px 0; min-width:320px;}


/* ==================================================
	공통사용
================================================== */

/* pagenation */
.pagenate {width:100%; clear:both;}
.pagenate {text-align:center; margin:20px auto 0;}
.pagenate li {display:inline-block; font-family:'Roboto','Noto Sans KR', sans-serif; font-weight:200; margin-left:3px;}
.pagenate li:first-child { margin-left:0px; }
.pagenate li a{display:inline-block; text-decoration:none; padding:0; width:36px; height:36px; line-height:36px; border:1px solid #c7c8cc; box-sizing:border-box; margin-left:-1px; vertical-align:middle;}
.pagenate li a:hover{background:#f6f6f6; font-weight:bold; text-decoration:none !important;}
.pagenate li a.board { text-indent:-9999em; margin-left:4px; }
.pagenate li a.board.first {background:#f3f3f3 url('/img/ico_first.png') no-repeat center center;}
.pagenate li a.board.prev {margin-right:30px; background:#efefef url('/img/ico_prev.png') no-repeat center center;}
.pagenate li a.board.next {margin-left:30px; background:#efefef url('/img/ico_next.png') no-repeat center center;}
.pagenate li a.board.last {background:#f3f3f3 url('/img/ico_last.png') no-repeat center center;}
.pagenate li a.current {color:#fff; background-color:#313234; font-weight:400; border:1px solid #313234;}

/* button */
.btnSet {position:relative; margin:20px 0; text-align:center; }
.btn{text-decoration:none !important; white-space:nowrap; display:inline-block; vertical-align:baseline; position:relative; cursor:pointer; padding:8px 10px; min-width:100px; background:rgba(0,0,0,0.8); color:#fff !important; margin:0 2px; text-align:center; font-weight:400; box-sizing:border-box; vertical-align: middle;}
input[type=submit].btn{text-decoration:none !important; white-space:nowrap; display:inline-block; vertical-align:baseline; position:relative; cursor:pointer; padding:8px 10px; min-width:100px; background:rgba(0,0,0,0.8); color:#fff !important; margin:0 2px; text-align:center; font-weight:400; box-sizing:border-box; vertical-align: middle;}
.btn:hover{background:rgba(0,0,0,1.0); color:#fff !important; box-shadow:rgba(0,0,0,0.3) 3px  3px 10px;}
.btn.cancel{background:rgba(0,0,0,0.6);}
.btn.intable{background:rgba(0,0,0,0.4) !important; min-width:80px;}
.intable:hover{background:rgba(0,0,0,0.6) !important;; color:#fff !important; box-shadow:rgba(0,0,0,0.3) 1px  1px 5px;}

/*보더 라운드*/
.bbs input[type='text'], .bbs input[type='password'], .bbs input[type='button'],  .bbs input[type='submit'], .bbs select {border-radius: 4px;} 
.pagenate li a.current, .pagenate li a{border-radius: 4px;}
.btn{border-radius: 4px;}
.check_box label:before{border-radius: 4px;}
.bbs span.state{border-radius: 4px;}

/*링크 마우스 오버*/
.bbs .view .link dl dd a:hover{color:#000; text-decoration:underline !important;}
.viewNavi > li a:hover{color:#000; text-decoration:underline !important;}

/*관리자 이름 미노출*/
.admin{display:none !important;}

/* ==================================================
	member
================================================== */
.login_form{max-width:480px; margin:0 auto;}
.login_form > div{margin-bottom:10px;}
.login_txt h3{font-size:3.0rem; font-weight: 600; color:#333;}
.login_form  .login_box input[type='text'], .login_form  .login_box input[type='password']{height:50px; padding-left:40px; font-size:1.6rem; }
.login_form  .login_box .id, .login_form  .login_box .password, .login_form  .login_box .name, .login_form  .login_box .email{position:relative; height:50px; margin-bottom:5px;}
.login_form  .login_box .id:before{content:''; position:absolute; left:10px; top:50%; width:24px; height:24px; margin-top:-12px;  background:url(/img/ico_id.png) no-repeat center center; display: block; }
.login_form  .login_box .password:before{content:''; position:absolute; left:10px; top:50%; width:24px; height:24px; margin-top:-12px;  background:url(/img/ico_password.png) no-repeat center center; display: block; }
.login_form  .login_box .name:before{content:''; position:absolute; left:10px; top:50%; width:24px; height:24px; margin-top:-12px;  background:url(/img/ico_name.png) no-repeat center center; display: block; }
.login_form  .login_box .email:before{content:''; position:absolute; left:10px; top:50%; width:24px; height:24px; margin-top:-12px;  background:url(/img/ico_email.png) no-repeat center center; display: block; }
.login_form  .login_btn input[type='submit']{height:50px; font-size:1.6rem; font-weight: 500; width:100%;}
.login_util {position:relative;}
.login_util a{display: block; }
.login_util > .join{float:left; font-weight: 500; color:#333;}
.login_util > div{float:right;}
.login_util > div > a{display:inline-block;}
.login_util > div > a:last-child{padding-left:20px;  position:relative;}
.login_util > div > a:last-child:before{content:''; position:absolute; left:8px; top:50%; margin-top:-7px; width:1px; height:14px; background:#cccccc;}
.find_wrap{max-width:480px; margin:0 auto;}
.find_tab li{width:50%; float: left;  box-sizing: border-box;}
.find_tab li > a{display:block; text-align: center; padding:10px; border:2px solid #ccc; background:#ccc;  box-sizing: border-box; color:#fff;}
.find_tab li > a.on{border-bottom:2px solid #fff; background:#fff;  color:#999; font-weight: 500;}


/* ==================================================
	board
================================================== */
.bbs{position:relative; width:100%; clear:both;}
.bbs input[type='text'], .bbs input[type='password'], .bbs select {height:40px; line-height: 40px; vertical-align: middle; padding:0 5px; width:100%; box-sizing:border-box;} 
.bbs h3{font-size:18px; font-weight: 500; color:#333; margin-bottom: 15px; letter-spacing: -1px;}


/* list */
.bbs .list{} 
.bbs .list thead{border-top:2px solid #333; border-bottom:1px solid #adadad;}
.bbs .list thead th{padding:15px 10px; font-size:1.5rem; color:#333;}
.bbs .list td{text-align:center; padding:15px 10px; line-height: 1.4;}
.bbs .list tbody tr:hover{background:#f9f9f9;} /*마우스오버 배경칼라지정*/
.bbs .list tbody tr{border-bottom:1px solid #e1e1e1;}
.bbs .list tbody tr:last-child{border-bottom:1px solid #adadad;}
.bbs .list .notice{background:#fffdf6;} /*탑공지  배경칼라지정*/
.bbs span.notice_ico{background:#e30000 url(/img/ico_notice.png) no-repeat center center; border-radius:12px; height:24px; width:24px; display: block; line-height: 24px; vertical-align: middle; text-indent: -99999px; margin:0 auto;}
.bbs .list .reNum{color:#a9a9a9; font-size:1.3rem;}
.bbs .list .reNum strong{font-weight: 400; color:#333; padding:0 2px;}
.bbs .list  .secret{display: inline-block; width:25px; height:25px; line-height: 20px;  border-radius:15px; background:#f9f9f9; text-align: center; vertical-align: middle;}
.bbs .list  .secret img{line-height: 25px; vertical-align: middle;}

.bbs .list span.comment{color:#999; font-size:1.2rem !important; font-weight:normal !important;} /*댓글수*/
.bbs .list .image img{width:80px; height:auto;}
.bbs .list .title span{font-size:1.5rem; font-weight:bold;}

.bbs .state span{display: block; padding:2px 8px; margin:auto; max-width:50px; font-size:1.4rem; text-align: center; box-sizing: border-box;}
.bbs .state span.waiting{background:#f4f4f4; color:#aaa; }
.bbs .state span.complete{background:#eff9fa; color:#1091ff;}
.bbs .state span b{display:none;}


/* search */
.bbsSearch {min-height:32px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; max-width:500px; width:100%; position:relative; overflow: hidden; margin:20px auto 20px;} 
.bbsSearch input[type='text'] { box-sizing:border-box; padding:5px 36px 5px 5px; border:0; width:100%; background-color:#fff; border:1px solid #c7c8cc; vertical-align:middle;}
.bbsSearch input[type='button'] {border:0; width:36px; text-indent:-9999em; position:absolute; top:50%; right:0; background:url('/img/ico_search.png') no-repeat center center ; display:inline-block; margin-top:-12px; }
.bbsSearch .searchWord {float:left; position:relative; width:70%;}
.bbsSearch .srchSelect {float:left; display:block; width:29%; margin-right:1%; box-sizing: border-box;}
.bbsSearch .srchSelect .dSelect{width:100%;}
.bbsSearch .searchWord.btnSearch input[type='text'] {width:calc(100% - 84px) !important; padding:5px;}
.bbsSearch .searchWord.btnSearch input[type='button']{width:80px; min-width: 80px;  text-indent:0; position: relative; top:inherit; right:inherit;  background:rgba(0,0,0,0.8); margin:0;}


/* view */
.bbs .view{}
.bbs .view{width:100%; border-top:2px solid #333;}
.bbs .view .title > dl{width:100%; padding:20px; border-bottom:1px solid #adadad; background:#fafafa; box-sizing: border-box;}
.bbs .view .title > dl > dt{font-size:2.0rem; color:#000; font-weight:500; line-height: 1.2; margin-bottom:10px;}
.bbs .view .title > dl > dd{display:inline-block; font-size:1.4rem; color:#999; position:relative; padding-right:18px;}
.bbs .view .title > dl > dd:after{content:""; display:inline-block;  width:1px; height:14px; background:#dddddd; position:absolute; right:8px; top:50%; margin-top:-7px;}
.bbs .view .title > dl > dd:last-child:after{background:none; padding-right:0;}
.bbs .view .title > dl > dd > span{padding-right:8px; color:#333; display: inline-block; text-indent: -99999px;} /* 텍스트 표기시 text-indent, 아래 아이콘 이미지 스타일 주석처리 */
.bbs .view .title > dl > dd > span.name{background:url(/img/ico_name.png) no-repeat left center; width:15px; height:auto;}
.bbs .view .title > dl > dd > span.date{background:url(/img/ico_date.png) no-repeat left center; width:13px; height:auto;}
.bbs .view .title > dl > dd > span.hit{background:url(/img/ico_hit.png) no-repeat left center; width:18px; height:auto;}
.bbs .view .cont{padding:20px; min-height:200px;  border-bottom:1px solid #e1e1e1;}
.bbs .view .cont img{max-width:100% !important;}
.bbs .view .reply{}
.bbs .view .reply > dl{width:100%; background:#f4f4f4; padding:20px 5%;}
.bbs .view .reply > dl > dt{ padding:20px 0; font-size:2.2rem; color:#000; position:relative;}
.bbs .view .reply > dl > dt > span{display:block; font-size:1.6rem; color:#999;}
.bbs .view .reply > dl > dt:after {content:""; position:absolute; width:17px; height:1px; background-color:#000; bottom:0; left:3px;}
.bbs .view .reply > dl > dd{ font-size:1.6rem; color:#5c5d63; padding:20px 0;}
.bbs .view .link{position:relative; overflow: hidden;}
.bbs .view .link dl{border-bottom:1px solid #e1e1e1; width:100%; display: block; position: relative; overflow: hidden; clear: both; padding:10px 20px; box-sizing: border-box;}
.bbs .view .link dl:last-child{border-bottom:1px solid #adadad;}
.bbs .view .link dl dt{float:left; color:#333; padding-right:15px; text-indent: -99999px;} /* 텍스트 표기시 text-indent, 아래 아이콘 이미지 스타일 주석처리 */
.bbs .view .link dl dt.file{background:url(/img/ico_file.png) no-repeat left center; width:16px; height:24px;}
.bbs .view .link dl dt.url{background:url(/img/ico_link.png) no-repeat left center; width:16px; height:24px;}
.bbs .view .link dl dd{float:left; font-size:1.4rem;;}


.viewNavi {border-top:1px solid #adadad; border-bottom:1px solid #adadad; margin-top:-1px;}
.viewNavi > li {position:relative; padding:10px 100px; border-top:1px solid #e1e1e1; font-size:1.4rem;;}
.viewNavi > li:first-child {border-top:0;}
.viewNavi > li span {position:absolute; left:15px; padding:0 20px; font-size:1.4rem; color:#333; font-weight: 400;}
.viewNavi > li span.next:before {content:""; width:0px; height:0px; border-style:solid; border-width:0 4.5px 5px 4.5px; border-color:transparent transparent #000 transparent; line-height:0px; position:absolute; top:8px; left:2px;}
.viewNavi > li span.prev:before {content:""; width:0px; height:0px; border-style:solid; border-width:5px 4.5px 0 4.5px; border-color:#000 transparent transparent transparent; line-height:0px; position:absolute; top:8px; left:2px;}
.viewNavi > li span:after{content:""; display:inline-block;  width:1px; height:14px; background:#dddddd; position:absolute; right:8px; top:50%; margin-top:-7px;}
.viewNavi > li a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; font-size:1.4rem;;}

/* 답변 */
.bbs .answer{border-top:1px solid #333; border-bottom:1px solid #adadad;}
.bbs span.answer_ico{background:#333 url(/img/ico_answer.png) no-repeat center center; border-radius:14px; height:28px; width:28px; display:inline-block; line-height: 30px; vertical-align: top; text-indent: -99999px; margin-right:5px; }

/* 리플 달기 */
.reply{position:relative; padding:20px; border-bottom:1px solid #adadad; background:#fafafa;}
.reply .tit{margin:5px 0;}
.reply .tit .number{color:#000; font-weight:bold;}
.reply .reply_write{overflow:hidden;padding:20px 0 10px;background:#fafafa;}
.reply .reply_write .tit_area{position:relative;width:80%;margin:0 0 10px 0;}
.reply .reply_write .tit_area .tit{display:inline-block;margin:0;font-size:1.6rem;line-height:18px; font-weight:bold;}
.reply .reply_write .tit_area .txt{display:inline-block;margin:0 0 0 5px;font-size:1.4rem;;line-height:16px;color:#999;}
/* 작성자가 빠지는 경우
.reply .reply_write .tit_area .limit{position:absolute;right:0;bottom:0px;color:#999;font-size:1.2rem;line-height:14px;}*/
/* 작성자가 들어가는 경우 */
.reply .reply_write .tit_area .limit{position:absolute;right:0;bottom:-30px;color:#999;font-size:1.2rem;line-height:14px;}
.reply .reply_write .write_area {clear:both;}
.reply .reply_write .write_area .input{padding:0 0 5px 0;}
.reply .reply_write .write_area .input input{border:1px solid #d1d1d1; height:36px; width:200px;}
.reply .reply_write .write_area .textarea{position:relative; float:left; width:80%;}
.reply .reply_write .write_area .textarea textarea{position:relative ;overflow-y:auto;box-sizing:border-box;width:100%;height:80px;padding:10px 10px;border:1px solid #d1d1d1;font-size:1.4rem;;line-height:18px;}
.reply .reply_write .write_area .bt_box{width:20%; float:left;}
.reply .reply_write .write_area .bt_box ul{width:100%;}
.reply .reply_write .write_area .bt_box li{width:100%;}
.reply .reply_write .write_area .bt_box li a{width:100%; display:block; height:80px;font-size:1.4rem;;padding:31px 0 0;border:1px solid #999;background:#999; text-align:center; color:#fff;}
.reply .reply_write .write_area .bt_box li a:hover{text-decoration:none !important;}
.reply .recommend{ }
.reply .recommend .re_list{border-top:1px solid #ebebeb;}
.reply .recommend .re_list {position:relative;}
.reply .recommend .re_list  li{padding:20px 0; border-bottom:1px solid #ebebeb;}
.reply .recommend .re_list  dl{position:relative;overflow:hidden;margin:0 0 8px 0;font-size:1.4rem;;line-height:20px;}
.reply .recommend .re_list  dl dt{position:relative; float:left; font-weight:bold; padding:0 12px 0 0; color:#999;}
.reply .recommend .re_list  dl dt span{font-weight:normal;}
.reply .recommend .re_list  dl dd{ clear:both; padding:0;}
.reply .recommend .re_list  dl dt span:before{content:"|"; display:inline-block; margin:0 10px; font-size:1.4rem; color:#e4e4e4;}
.reply .recommend .re_list  dl dd .add_data{margin:0 8px 0 0;font-size:1.4rem;;line-height:16px;color:#333;}
.reply .recommend .re_list  p{width:100%;font-size:1.4rem;;line-height:22px;color:#666;word-break:break-all;}
.reply .recommend .re_list  .iptEmpty{padding:30px 0 !important;color:#555;}
.reply .recommend .re_list  .bt_delete{margin-left:10px; width:20px; height:20px;font-size:0;line-height:0;background:#999 url("/img/delete_btn.png") no-repeat center; background-size:contain;}
.reply .recommend .none_list{padding:50px 10px;border-bottom:1px solid #ebebeb;text-align:center}

.qna_pass {display:none; width:500px; position:absolute; height:265px; margin-left:-250px; top:50%; left:50%; box-sizing:border-box; padding:35px 20px; margin-top:-132.5px; background:#fff;  border-radius: 10px; box-shadow:rgba(0,0,0,0.2) 5px  5px 30px; }
.qna_pass .topic {font-size:1.6rem; font-weight: 300; height: 50px; line-height: 50px;}
.qna_pass .ipt {padding: 25px 0; width:90%; margin: 0 auto; box-sizing: border-box; background:#f9f9f9;}
.qna_pass .ipt span {display:inline-block; color:#1d1d1d; font-size:1.6rem; font-weight: 500; line-height:35px; margin-right:20px; }
.qna_pass .ipt input {width:150px; background:#fff;}


/* write */
.bbs .write_wrap .wr_box{margin-top: 40px;}
.bbs .write{border-top:2px solid #333; border-bottom:1px solid #999;}
.bbs .write thead th{text-align:center;}
.bbs .write tbody th{text-align:left;}
.bbs .write th{padding:15px 15px;  color:#333;  font-weight: 500;  border-bottom:1px solid #ebebeb;}
.bbs .write th br{display:none;}
.bbs .write th .required{color:#F00004; font-weight: 400; font-size:1.6rem; display: inline-block; width:10px; height:30px; line-height:32px; vertical-align: middle;}
.bbs .write th .required > span{width:0; height:0; visibility:hidden; opacity:0;  filter:alpha(opacity=0); -ms-filter:alpha(opactiy=0); }
.bbs .write td{padding:10px; border-bottom:1px solid #ebebeb; box-sizing:border-box;}
.bbs .write td .tx{display:inline-block;float:left;width:25px;line-height:32px;text-align:center;}
.bbs .write td textarea{width:100%; height:200px; box-sizing:border-box;}
.bbs .write td .calendar{position: relative;}
.bbs .write td .calendar span{display: block;}
.bbs .write td .calendar span.material-icons{cursor:pointer; position:absolute; right:5px; top:50%; margin-top:-12px; color:#333;}
.bbs .write td .check_list .check_box{float: left; margin-left: 15px;}
.bbs .write td .check_list .check_box:first-child{margin-left: 0;}
.bbs .write td input[type="checkbox"] + label{cursor: pointer;}
.bbs .write .email span.at{display: inline-block; width:23px; text-align: center; height:40px;}
.bbs .write .email input, select{display: inline-block;}
.bbs .write .email input{width:calc(50% - 15px);}
.bbs .write .fileBox{width:100%; height:40px;}
.bbs .write .fileBox .inputBox{width:calc(100% - 115px) !important; float:left;}
.bbs .write .fileBox input{width:100%;}
.bbs .write .fileBox .fileBtn{display:block; width:110px; height:40px; float:left;}

.bbs .write .oldFileDel{margin-top: 10px;}


.bbs .write p.help{text-align:left;font-size:1.3rem;line-height:26px;letter-spacing:-1px; color:#999; display: inline-block;}
.bbs .write p.help:before{content:'※ ';}
.bbs .write tr:last-child th, .bbs .write tr:last-child td{border-bottom:1px solid #999;}
.bbs .spam > img{border-radius: 4px;}
.bbs .spam_refresh{text-indent: -99999px; width:40px; height:40px; border-radius: 4px; background:#999 url(/img/ico_refresh.png) no-repeat center center;}
.bbs .write td.password > p > input{margin-top:4px;}
.bbs .write td.addr > input{margin-top:4px;}
.bbs .write td.addr > input:first-child{margin-top:0;}

.bbs .write .pwdIpt {display:none; }
.bbs .write div.pwdIpt {margin-top:10px;}
/* 약관 및 개인정보수집 동의 */
.agree{margin:0 0 30px;}
.agree_con{background:#fff; overflow-y:scroll; width:100%; height:150px; border:1px solid rgb(204, 204, 204); padding:10px;  box-sizing:border-box; border-radius: 4px;}
.agree_con > strong{color:#000; font-size:1.8rem; font-weight: 500; margin-bottom:10px; display: block;}
.agree p.check_box{margin:10px 0 0;text-align:right;}
.agree_txt p, .agree_txt ul, .agree_txt ol{margin-bottom:10px;}
.agree_txt h4{margin-top:20px; color:#333; font-size:1.6rem; font-weight: 500;}
.agree_txt dt{font-weight: 500; margin-top:10px}
.agree_txt dd:last-child{margin-bottom:10px;}
.agree_txt .num_list {counter-reset: item;}
.agree_txt .num_list > li, .agree_txt .num_list > dt, .agree_txt .num_list > dd{position:relative; padding-left: 15px;}
.agree_txt .num_list > li:before, .agree_txt .num_list > dt:before{content: counter(item)'.'; counter-increment:item; position:absolute; top:1px; left:0;}
.agree_txt .subnum_list{counter-reset: item;}
.agree_txt .subnum_list > li, .agree_txt .subnum_list > dt, .agree_txt .subnum_list > dd{padding-left: 20px; position:relative;}
.agree_txt .subnum_list > li:before, .agree_txt .subnum_list > dt:before  {content: counter(item); counter-increment:item; position:absolute; top:5px; left:0; width:14px; height:14px;line-height: 14px; font-size:10px; vertical-align: middle; border:1px solid #707070; border-radius: 10px; text-align: center; display: inline-block; }
.agree_txt .dotline_list > li{position:relative; padding-left:10px;}
.agree_txt .dotline_list > li:before{content:''; width:4px; height:2px; background:#707070; left:0; top:11px; position:absolute;}


/* galley */
.bbs .gallery{width:100%; border-top:2px solid #333; border-bottom:1px solid #999;  padding:20px 0; position:relative; overflow: hidden;}
.bbs .gallery > ul{width:102%; margin-left:-2%; margin-top:-20px;}
.bbs .gallery > ul > li{ width:23%; margin:20px 0 0 2%; float:left; }
.bbs .gallery > ul > li > a{width:100%; /*height:100%;*/ display:block; padding:15px; box-sizing:border-box; border:1px solid #dadada;}
.bbs .gallery > ul > li > a:hover{ box-shadow: rgba(0,0,0,0.2) 2px 2px 10px}
.bbs .gallery > ul > li > a dt{width:100%;height:auto; ; overflow:hidden; }
.bbs .gallery > ul > li > a dt img{width:100%;max-width:100%; height:auto; visibility:hidden; opacity:0;  filter:alpha(opacity=0); -ms-filter:alpha(opactiy=0); }
.bbs .gallery > ul > li > a dt.noimg img{opacity:1; visibility:visible; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100); width:100%; height:auto; }
.bbs .gallery > ul > li > a dt.imgs {width:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:relative;}
.bbs .gallery > ul > li > a dd{width:100%;}

.bbs .gallery > ul > li > a dd.title{font-size:1.8rem; color:#333;  font-weight:500; height:40px; line-height:20px; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; text-overflow:ellipsis; word-break:keep-all; max-width:100%; width:100%; position:relative; margin:15px 0;  }
.bbs .gallery > ul > li > a dd.info { box-sizing:border-box; position:relative; font-size:1.4rem; overflow:hidden; padding:5px 0; box-sizing: border-box;}
.bbs .gallery > ul > li > a dd.info:before{content:''; ;display:block; position:absolute; left:0; top:0px; width:100%; height:1px; background: #efefef;}
.bbs .gallery > ul > li > a dd.info li{display:inline-block; line-height:26px; height:26px; vertical-align: middle; padding:0 5px; color:#999 }
.bbs .gallery > ul > li > a dd.info li:first-child {padding-left:0;}

.bbs .gallery > ul > li > a dd.info li > span{padding-right:4px; color:#333; display: inline-block; text-indent: -99999px; line-height:26px; height:26px; vertical-align: middle;} /* 텍스트 표기시 text-indent, 아래 아이콘 이미지 스타일 주석처리 */
.bbs .gallery > ul > li > a dd.info li > b{display:inline-block;  line-height:26px; height:26px; vertical-align: middle;  font-size:1.4rem; font-weight:normal;}
.bbs .gallery > ul > li > a dd.info li > span.name{background:url(/img/ico_name.png) no-repeat left center; width:15px; height:24px;}
.bbs .gallery > ul > li > a dd.info li > span.date{background:url(/img/ico_date.png) no-repeat left center; width:13px; height:24px;}
.bbs .gallery > ul > li > a dd.info li > span.hit{background:url(/img/ico_hit.png) no-repeat left center; width:18px; height:24px;}

.bbs .gallery span.notice_ico{position:absolute; left:5px; top:5px;}

.bbs .gallery2 > ul > li{width: 18%;}

/* grid */
.grid-gallery{border-top:2px solid #333; border-bottom:1px solid #999;}
.grid-gallery .grid > li{padding:10px; box-sizing: border-box;}
.grid-gallery .grid > li figure{border:1px solid #dadada; }
.grid-gallery .grid figcaption {padding:0; background:none;}

.grid-gallery .grid figcaption .title {font-size:1.8rem; color:#333; font-weight:600; height:25px; line-height:25px; overflow:hidden; display:block; -webkit-line-clamp:1; white-space:nowrap; text-overflow:ellipsis;  word-break:keep-all; max-width:100%; margin-top:10px;}
.grid-gallery .grid figcaption .contxt {font-size:1.4rem; color:#777; height:40px; line-height:20px; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; text-overflow:ellipsis; word-break:keep-all; max-width:100%; width:100%; position:relative; margin-bottom:10px; }
.grid-gallery .grid figcaption .info { box-sizing:border-box; font-size:1.4rem; overflow:hidden; padding:5px 0; position:relative;}
.grid-gallery .grid figcaption .info:before{content:''; ;display:block; position:absolute; left:0; top:0px; width:100%; height:1px; background: #efefef;}
.grid-gallery .grid figcaption .info p{display:inline-block; line-height:24px; height:24px; vertical-align: middle; padding:0 5px; float:inherit; width:auto; color:#999;}
.grid-gallery .grid figcaption .info p:first-child {padding-left:0;}

.grid-gallery .grid figcaption .info p > span{padding-right:4px; color:#333; display: inline-block; text-indent: -99999px; line-height:24px; height:24px; vertical-align: middle;} /* 텍스트 표기시 text-indent, 아래 아이콘 이미지 스타일 주석처리 */
.grid-gallery .grid figcaption .info p > b{display:inline-block;  line-height:26px; height:26px; vertical-align: middle;  font-size:1.4rem; font-weight:normal;}
.grid-gallery .grid figcaption .info p > span.name{background:url(/img/ico_name.png) no-repeat left center; width:15px; height:24px;}
.grid-gallery .grid figcaption .info p > span.date{background:url(/img/ico_date.png) no-repeat left center; width:13px; height:24px;}
.grid-gallery .grid figcaption .info p > span.hit{background:url(/img/ico_hit.png) no-repeat left center; width:18px; height:24px;}


/* faq */
.bbs .faqTab {width:100%; padding:10px; background:#f9f9f9; box-sizing: border-box; margin-bottom:20px;}
.bbs .faqTab ul {width:100%; box-sizing:border-box;}
.bbs .faqTab ul li {float:left; width:auto;}
.bbs .faqTab .itemList1 > li {width:50%;}		/* 2개 */
.bbs .faqTab .itemList2 > li {width:33.3333%;}	/* 3개 */
.bbs .faqTab .itemList3 > li {width:25%;}		/* 4개 */
.bbs .faqTab .itemList4 > li {width:20%;}		/* 5개 */
.bbs .faqTab .itemList5 > li {width:16.666%;}	/* 6개 */
.bbs .faqTab .itemList6 > li {width:14.285%;}	/* 7개 */
.bbs .faqTab .itemList7 > li {width:12.5%;}		/* 8개 */
.bbs .faqTab .itemList8 > li {width:11.111%;}	/* 9개 */
.bbs .faqTab .itemList9 > li {width:10;}		/* 10개 */
.bbs .faqTab ul li a {display:block; height:42px; line-height:42px; text-align:center; font-size:1.5rem; box-sizing:border-box; border-right:1px solid #ececec;  border-bottom:1px solid #ececec; transition:all .2s; -webkit-transition:all .2s; background:#fff; margin:0 2px;}
.bbs .faqTab ul li a.on{background:#333; color:#fff; text-decoration:none !important;}
.bbs .faqTab ul li a:hover {background:rgba(0,0,0,1.0); color:#fff !important; box-shadow:rgba(0,0,0,0.3) 3px  3px 10px; border:none;}
.bbs .faqTab_m {display:none; width:100%; padding:15px 0; position:relative; z-index:15;}
.bbs .faqTab_m > a{display:block; width:100%; height:40px; line-height:38px; border:1px solid #000; box-sizing:border-box; /*background:url('/img/mdepth_down.png') no-repeat calc(100% - 15px) center;*/ background-size:20px; padding: 0 15px; font-size:1.6rem; box-sizing: border-box;  position:relative;}
.bbs .faqTab_m > a:after{border: 2px solid #333; border-radius: 2px; border-left: 0; border-top: 0; content: ' '; display: block; width: 8px; height: 8px; margin-top: -8px; pointer-events: none; position: absolute; top: 50%; transform: rotate(45deg); transform-origin: center;  right:10px; z-index: 4;}
.bbs .faqTab_m > a.on:after{transform: rotate(225deg); margin-top: -4px;}
.bbs .faqTab_m > ul {position:absolute; left:0;  border:1px solid #333; border-top:0; width:100%; display:none;  box-sizing: border-box;}
.bbs .faqTab_m > ul li a{display:block; width:100%; height:40px; line-height:39px; border-top:1px solid #dadada; padding:0 15px; box-sizing:border-box; background:#fff; font-size:15px;}
.bbs .faqTab_m > ul li:first-child a{border-top:0;}
.bbs .faqTab_m a:hover {text-decoration:none !important;} 

.bbs .list.faq thead{display:none;}
.bbs .list.faq{border-top:2px solid #333; border-bottom:1px solid #adadad;}
.bbs .list.faq tbody td{text-align:left; padding:15px 12px; }
.bbs .list.faq tbody td:first-child{ padding-left:40px; position:relative;}
.bbs .list.faq tbody .faqA{display:none; background:#f9f9f9;}
.bbs .list.faq tbody .faqQ td.title{ cursor:pointer;  font-weight:500; color:#333; position:relative;}
.bbs .list.faq tbody .faqQ td.title:before{content:""; display:inline-block;  width:1px; height:14px; background:#dddddd; position:absolute; left:0; top:50%; margin-top:-7px;}
.bbs .list.faq tbody tr{border-bottom:none; border-top:1px solid #e1e1e1;}
.bbs .list.faq tbody tr:first-child{border-top:0;}
.bbs .list.faq tbody tr.faqA{border-top:0;}
.bbs .list.faq tbody .faqA td{position: relative; padding-right: 175px;}
.bbs .list.faq tbody .faqQ td:first-child:before{width:22px; height:22px; line-height: 22px; vertical-align: middle; content: 'Q'; background:#333; border-radius: 11px; color:#fff; position: absolute; left:10px; top:15px; display: block; text-align: center; font-family:'Roboto','Noto Sans KR', sans-serif; font-weight: 500; font-size:1.2rem;}
.bbs .list.faq tbody .faqA td:first-child:before{width:22px; height:22px; line-height: 22px; vertical-align: middle; content: 'A'; background:#999; border-radius: 11px; color:#fff; position: absolute; left:10px; top:15px; display: block; text-align: center; font-family:'Roboto','Noto Sans KR', sans-serif; font-weight: 500; font-size:1.2rem;}
.bbs .list.faq tbody .faqA td .btn_box{position: absolute; right: 10px; bottom: 10px;}
.bbs .list.faq tbody .faqA td a{padding: 5px 10px; min-width: 65px;}



/* postImage */
.bbs .postSection {width:100%; }
.bbs .postSection .postList {width:102%; margin-left:-2%; margin-top:-2%; }
.bbs .postSection .postList > li {float:left; width:48%; margin-left:2%; margin-top:2%; }
.bbs .postSection .postList > li a {display:block; width:100%; box-sizing:border-box; padding:10px; border:1px solid #dadada; position:relative; overflow:hidden; transition:all .2s; -webkit-transition:all .2s; letter-spacing:-.5px;}
.bbs .postSection .postList > li a:hover {text-decoration:none !important; box-shadow: rgba(0,0,0,0.2) 2px 2px 10px}
.bbs .postSection .postList > li a .imgs {display:block; position:absolute; left:0; top:0; vertical-align:middle; width:30%; height:100%;  background-repeat:no-repeat; background-size:cover ;background-position:center center;  border:10px solid #fff; box-sizing:border-box; }
.bbs .postSection .postList > li a .imgs i {display:block; position:absolute; left:0; top:0px; }
.bbs .postSection .postList > li a .txt {display:block; width:100%; padding-left:32%;  box-sizing:border-box;  vertical-align:top; position:relative;  padding-right:15px; padding-bottom:35px;}
.bbs .postSection .postList > li a .txt .category {font-size:1.4rem; color:#1091ff; font-weight:400; position:relative; height:30px; line-height:30px;  margin-bottom:5px; width:auto; display:inline-block; }
.bbs .postSection .postList > li a .txt .category:after {clear:both; content:''; ;display:block; position:absolute; left:0; bottom:-.5px; width:100%; height:1px; background:#1091ff; }
.bbs .postSection .postList > li a .txt .title {font-size:1.8rem; color:#333; font-weight:600; height:25px; line-height:25px; overflow:hidden; display:block; -webkit-line-clamp:1; white-space:nowrap; text-overflow:ellipsis;  word-break:keep-all; max-width:100%;}
.bbs .postSection .postList > li a .txt .contxt {font-size:1.4rem; color:#777; height:40px; line-height:20px; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; text-overflow:ellipsis; word-break:keep-all; max-width:100%; width:100%; position:relative; margin-bottom:10px; }
.bbs .postSection .postList > li a .info { box-sizing:border-box; position:absolute; bottom:0; left:32%; width:68%; color:#999; font-size:1.4rem; overflow:hidden; padding:5px 0; box-sizing: border-box; vertical-align: middle;}
.bbs .postSection .postList > li a .info:before{content:''; ;display:block; position:absolute; left:0; top:0px; width:100%; height:1px; background: #efefef;}
.bbs .postSection .postList > li a .info ul{line-height:26px; height:26px; vertical-align: middle;}
.bbs .postSection .postList > li a .info li{display:inline-table; line-height:26px; height:26px; vertical-align: middle; padding:0 5px; }
.bbs .postSection .postList > li a .info li:first-child {padding-left:0;}

.bbs .postSection .postList > li a .info li > span{display:inline-block;  padding-right:4px; color:#333; text-indent: -99999px; line-height:26px; height:26px; vertical-align: middle;  font-size:1.4rem;;} /* 텍스트 표기시 text-indent, 아래 아이콘 이미지 스타일 주석처리 */
.bbs .postSection .postList > li a .info li > b{display:inline-block;  line-height:26px; height:26px; vertical-align: middle;  font-size:1.4rem; font-weight:normal;}
.bbs .postSection .postList > li a .info li > span.name{background:url(/img/ico_name.png) no-repeat left center; width:15px; height:24px;}
.bbs .postSection .postList > li a .info li > span.date{background:url(/img/ico_date.png) no-repeat left center; width:13px; height:24px;}
.bbs .postSection .postList > li a .info li > span.hit{background:url(/img/ico_hit.png) no-repeat left center; width:18px; height:24px;}

.bbs .postSection .postList span.notice_ico{margin:5px;}

@media screen and (max-width: 1024px){
     .bbs .gallery > ul > li{width:31.333%; margin-left:2%;}
     .bbs .write th{padding:15px 0;}
}
@media screen and (max-width: 960px){
    .bbs .write .email .checkBtn .select{width:calc(100% - 88px) !important; max-width: 345px;}
}
@media screen and (max-width:768px)
{
     /* pagenation */
	.pagenate li a.board {margin-left:2px; }
	.pagenate li a.board.prev {margin-right:0px;}
	.pagenate li a.board.next {margin-left:0px;}
		
	/* list */	
     .bbs .list colgroup {display:none;}
	.bbs .list thead {display:none;}
	.bbs .list tbody {border-top:2px solid #333 !important;}
	.bbs .list tbody tr{padding:10px 0; width:100%; display:block; text-align:left; vertical-align:middle; border-bottom:1px solid #d9d9d9;}
	.bbs .list tbody td{width:100%;display:block; text-align:left; padding:0 0; border-bottom:none; position:relative;}
     .bbs span.notice_ico{margin:0;}
     .bbs .list tbody td.no {display: none;}
     .bbs .list tbody td.title{color:#333;  font-weight: 500;}
	.bbs .list tbody td.name, .bbs .list tbody td.date, .bbs .list tbody td.hit{width:auto; display:inline-block; position:relative; margin-top:5px;  padding-right:12px; vertical-align: top; line-height: 24px; padding-left:24px;}
     .bbs .list tbody td.name:after, .bbs .list tbody td.date:after{content:""; position:absolute;  width:1px; height:14px; background:#dddddd; position:absolute; right:6px; top:50%; margin-top:-7px;}
     .bbs .list tbody td.name:before{content:""; left:0; top:0;  position:absolute; background:url(/img/ico_name.png) no-repeat left center; width:24px; height:24px;}
     .bbs .list tbody td.date:before{content:"";  left:0; top:0;  position:absolute; background:url(/img/ico_date.png) no-repeat left center; width:24px; height:24px;}
     .bbs .list tbody td.hit:before{content:"";  left:0; top:0; position:absolute;  background:url(/img/ico_hit.png) no-repeat left center; width:24px; height:24px;}
     .bbs .list tbody td.state{width:auto; display:inline-block; margin-top:5px;}
     .bbs .list tbody td.state span{max-width:70px;}
     .bbs .state span b{display: inline-block; font-weight:normal;}
     
	.bbs .list tbody td.image{width:80px; padding-right:10px; display:table-cell;}
	.bbs .list.imgList tbody td.title{width:auto; display:table-cell;}
	.bbs .list .image img{width:100%; height:auto;}
     
     .bbs .list tbody td span.mo{display:inline-block; width:60px; position:relative; padding:0 10px; font-weight: 400;}
     .bbs .list tbody td span.mo:after{content:''; width:1px; height:10px; top:50%; margin-top:-5px; background:rgba(0,0,0,0.1); position:absolute; right:10px;}
     
     /* faq */
     .bbs .list.faq tbody td{padding:5px 10px;}
     .bbs .list.faq tbody .faqQ td.title{padding-left:40px;}
     .bbs .list.faq tbody .faqQ td:first-child:before{top:5px;}
     .bbs .list.faq tbody .faqA td{padding:15px 10px 15px 40px;}
     .bbs .list.faq tbody .faqQ td.title:before{background:none;}
     
	/* gallery */
	.bbs .gallery > ul {width:102%; margin-left:-2%; }
	.bbs .gallery > ul > li {width:48%; margin-left:2%; }
	

	/* view */
	.viewNavi > li{padding:8px 20px 8px 45px; }
	.viewNavi > li span{width:30px; height:30px; overflow:hidden; text-indent:-9999em; left:20px; padding:0;}
     .viewNavi > li span::after {background:none;}
     .bbs .view .link dl dt{padding-right:10px;}

	/* 리플 달기 */
	.reply .reply_write .write_area{float:none}
	.reply .reply_write .write_area .textarea{float:none;display:block;width:100%}
	.reply .reply_write .write_area .textarea textarea{width:100%}
	.reply .reply_write .write_area .textarea .limit{right:auto;left:0}
	.reply .reply_write .write_area .bt_box{float:right;margin:10px 0 0 0; width:120px;}
	.reply .reply_write .write_area .bt_box li a{padding:0;height:33px;box-sizing:border-box; line-height:33px;}
	.reply .reply_write .tit_area{width:100%;}
	.reply .reply_write .tit_area .txt{margin:5px 0 0; display:block;}
	/* 작성자가 빠지는 경우
	.reply .reply_write .tit_area .limit{position:absolute; left:0; top:340%; right:auto; bottom:auto;}*/
	/* 작성자가 들어가는 경우 */
	.reply .reply_write .tit_area .limit{position:absolute; left:0; top:450%; right:auto; bottom:auto;}

	/* write */
	
	.bbs .write th {width:100%; display:block; border-bottom:none; padding:10px 10px 0; box-sizing: border-box;}
	.bbs .write td {width:100%; display:block; box-sizing: border-box;}
	.bbs .write td input {width:100%; }
     .bbs .write td input.spam_refresh{width:40px;}
     .bbs .write tr:last-child th{border-bottom:none;}

     .bbs .write .fileBox .inputBox{width:calc(100% - 85px) !important;}
     .bbs .write .fileBox .fileBtn{width:80px;}
     .fileBox .fileBtn label{width:80px;}

	.bbs .write p.help{word-break:keep-all; line-height:18px; margin-top:5px; display:block;}

	.bbs .write colgroup {display:none;}

	/*p ostImage */
	
	.bbs .postSection .postList {width:100%; margin-left:0;}
	.bbs .postSection .postList > li{width:100%; margin-left:0; }

	/* faq */

	.bbs .faqTab {display:none;}
	.bbs .faqTab_m {display:block;}


	/* member */


}

@media screen and (max-width: 500px){

	.shop .listType_image .pdt5 > li{width:100%; border-right:none !important;} /* 상품노출개수 5개 -> 1개*/
	.shop .listType_image .pdt4 > li{width:100%; border-right:none !important;} /* 상품노출개수 4개 -> 1개*/
	.shop .listType_image .pdt3 > li{width:100%; border-right:none !important;} /* 상품노출개수 3개 -> 1개*/
	.shop .listType_image .pdt2 > li{width:100%; border-right:none !important;} /* 상품노출개수 2개 -> 1개*/
	
     /*.qna_pass .topic{font-size:1.4rem;;}*/
     .qna_pass .ipt{width:100%;}
     .qna_pass{width:96%; margin-left:0; left:2%;}
     .qna_pass .ipt span{margin-right:10px;}
     
	/* gallery */
	.bbs .gallery > ul {width:100%; margin-left:0%; }
	.bbs .gallery > ul > li {width:100%; margin-left:0%; }

	/* search */
	.bbsSearch {width:100%;} 
	.bbsSearch .srchSelect {width:100%; margin-right:0; }
	.bbsSearch .searchWord {width:100%; margin-top:5px;}

	/* write */
     .bbs .write .ipt_box {width:100%; position:relative; overflow: hidden;}
     .bbs .write .ipt_box input[type="text"] {width:calc(100% - 85px) !important; float:left;}
     .bbs .write .ipt_box a {display:block;width:80px; float:left;}
     .bbs .write input.max300{max-width:100%;}
     .bbs .write .email .select.max200{max-width:100%;}
     .bbs .write .spam input.max200{width:calc(100% - 127px) !important; max-width: none;}

	/* 리플 달기 */
	.reply .reply_write .write_area .input input{width:100%;}


	/* postImage */
	.bbs .postSection .postList li a .imgs{width:40%;}
     .bbs .postSection .postList > li a .info{left:42%;}
	.bbs .postSection .postList li a .txt{padding-left:42%; padding-right:10px; }
	.bbs .postSection .postList li a .txt .category{ height:25px; line-height:1;}
	.bbs .postSection .postList li a .txt .title{height:20px; line-height:1; }
	.bbs .postSection .postList li a .txt .contxt{height:35px; line-height:17.5px; }
	.bbs .postSection .postList li a .wdate{ left:47%;}
     .bbs .postSection .postList > li a .info li > b{}

}

@charset "utf-8";
/* CSS Document */
* {
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -o-text-size-adjust: none;
}

*:before,
*:after{
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

html, body {
    height: 100%;
    font-size-adjust: none;
    -webkit-font-size-adjust: none;
    -o-font-size-adjust: none;
    -moz-font-size-adjust: none;
}

html {
    font-size: 62.5%;
}

/*기본폰트 10px*/
body, th, td, input, select, textarea, button {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: -0.42px;
    font-family: 'Pretendard', sans-serif;
    color: #111;
    word-break: keep-all;
    word-wrap: break-word;
}

::-webkit-input-placeholder {
    color: #999;
}

:-moz-placeholder {
    color: #999;
}

::-moz-placeholder {
    color: #999;
}

:-ms-input-placeholder {
    color: #999;
}

caption {
    display: none;
}

body, div,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, code, form, fieldset, legend, p, blockquote,
th, td, input, select, textarea, button,
header, nav, menu, section, article {
    margin: 0;
    padding: 0
}

button {
    font-size: 0;
}

fieldset, img {
    border: 0 none
}

dl, ul, ol, menu, li {
    list-style: none;
    vertical-align: middle
}

blockquote, q {
    quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset; /* 크롭입력배경색제거 */
}

input, select, textarea, button {
    vertical-align: middle;
}

input[type='text'], input[type='password'], input[type='submit'], input[type='search'] input[type="number"] {
    -webkit-appearance: none;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none; margin: 0;
}
input[type='text']::placeholder, input[type='password']::placeholder, input[type='submit']::placeholder, input[type='search']::placeholder {
    font-weight: 600;
    color: #999;
}

button, input[type='button'], input[type='submit'], input[type='reset'], input[type='file'] {
    -webkit-appearance: none;
    border-radius: 0;
    border: none;
}

input[type='button'] {
    -webkit-appearance: none;
    border: 0;
}

input[type='search']:-webkit-search-cancel-button {
    -webkit-appearance: none
}

input[type='radio'], input[type='checkbox'] {
    border: none;
}

button {
    border: none;
    background-color: transparent;
    cursor: pointer;
}

a, a:link, a:visited, a:hover, a:active {
    color: inherit;
    text-decoration: none;
}

address, caption, cite, code, dfn, em, var,i {
    font-style: normal;
    font-weight: normal
}

table {
    width: 100%;
    border-collapse: collapse;
}

img {
    vertical-align: middle;
}

legend, caption {
    display: none;
}
@charset "utf-8";
/* CSS Document */
.pc{display:block;} /*pc 노출 = 테블릿, 모바일 미노출*/
.pcta{display:block;} /*pc, 테블릿 노출 = 모바일 미노출*/
.mo{display:none;} /*모바일 노출 = pc,테블릿 미노출*/
.ta{display:none;} /*테블릿, 모바일 노출 = pc 미노출*/

@media screen and (max-width: 1410px){
    /* sub */
    #sub.project .content p .dpb{display: inline;}
    #sub.introduce .txt-wrap .content p .dpb{display: inline;}
    #sub.introduce .section3 .box .box-tit p .dpb{display: block;}
    
    #sub.introduce .section2{text-align: center;}
    #sub.introduce .section2 .sec-con{flex-direction: column;}
    #sub.introduce .section2 .txt-wrap{text-align: center;}
    #sub.introduce .section2 .txt-wrap p .dpb{display: block !important;}
}
@media screen and (max-width: 1200px){
    .pc{display: none;}
    .ta{display:block;}

    /* header */
    #header{box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.05);}
    #header .gnb{display: none;}
    #header .my-account{display: none;}
    #header.fixed .search{display: none;}

    #header .btn-wrap{display: flex;}
    #header .btn-search-open{display: block;}
    #header .btn-allmenu-open{display: block;}
    .allmenu .allmenu-wrap .btm{display: block;}

    /* main */
    #main .condition-search{margin-top: -87px;}
    #main .main-banner{margin-top: 40px;}

    /* member */
    #sub.member .sec-wrap{padding: 30px 0 120px;}
    #sub.login .sec-wrap > .size{flex-wrap: wrap;}

    /* mypage */
    #sub.mypage .sec-wrap{padding-bottom: 120px;}
    #sub.mypage .sec-wrap > .row-end{display: block;}
    #sub.mypage .nav-wrap{position:relative; width: 100%;}
    #sub.mypage .nav-wrap > a{display: block;}
    #sub.mypage .nav-wrap > ul{display:none; position:absolute; left:0; top:100%; margin-top:5px; width: 100%; border-radius: 10px; border: 1px solid #ececec; box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.08); overflow: hidden; z-index: 5;}
    #sub.mypage .nav-wrap > a.on + ul{display: block;}
    #sub.mypage .nav-wrap ul li{margin-top: 0; border-top: 1px solid #ececec;}
    #sub.mypage .nav-wrap ul li:first-of-type{border-top: none;}
    #sub.mypage .nav-wrap ul li a{display: block; height: 50px; line-height: 50px; padding: 0 20px; border: none; border-radius: 0; transition: none;}
    #sub.mypage .nav-wrap ul li.on a{border: none; background-color: #fff;}
    #sub.mypage .nav-wrap ul li a span{font-size: 14px; color: #111;}
    #sub.mypage .nav-wrap ul li.on a span{color: #111;}
    #sub.mypage .nav-wrap ul li a svg{display: none;}

    #sub.mypage .content-wrap{margin-top: 25px;}
    #sub.request-enterprise .preview .txt-wrap .content-wrap{margin-top: 0;}
}
@media screen and (max-width: 1024px){
    html{font-size: 60%;}
}

@media screen and (max-width: 960px){
    /* header */
    #header .size{height: 60px;}
    #header .logo img{width: 90px;}

    .allmenu .allmenu-wrap .top{height: 60px; padding: 10px 20px;}
    .allmenu .allmenu-wrap .top .btn-allmenu-close img{width: 18px;}
    .allmenu .allmenu-wrap .mid{padding: 0 20px;}
    .allmenu .allmenu-wrap .mid .mo-gnb .depth1 > li > a{padding: 23px 0;}
    .allmenu .allmenu-wrap .mid .mo-gnb .depth2{padding: 20px;}
    .allmenu .allmenu-wrap .mid .mo-gnb .depth2 > li{padding: 12px 0;}

    /* footer */
    #footer{padding: 30px 0 25px;}
    #footer .left .logo img{width: 86px;}

    #footer .left .info-list ul{gap: 21px;}
    #footer .left .info-list ul li{font-size: 12px;}
    #footer .left .info-list ul li:before{left:-11px; top:2px;}
    #footer .left .info-list p{padding-top: 6px;}
    #footer .left .copy{margin-top: 6px;}
    #footer .left .copy p{font-size: 12px;}

    #footer .right .sns-list ul li a{width: 50px; height: 50px; line-height: 50px;}
    #footer .right .sns-list ul li.youtube a img{width: 24px;}
    #footer .right .sns-list ul li.instar a img{width: 20px;}

    /* common */
    .box-list-wrap .box-list > ul{margin:0 -10px;}
    .box-list-wrap .box-list > ul > li{width: auto !important; padding: 0 10px;}
    .box-list-wrap .box-list > ul > li > .inner{border-radius: 9px;}
    .box-list-wrap .box-list .img-wrap .img img{width: 235px;}
    .box-list-wrap .box-list .normal .txt-wrap .inner{padding: 18px 20px;}
    .box-list-wrap .box-list .normal .txt-wrap .top{padding-bottom:10px;}
    .box-list-wrap .box-list .normal .txt-wrap .top .title i{height:15px; font-size: 12px; overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 200px;
        width: 100%;
        display: block;}
    .box-list-wrap .box-list .normal .txt-wrap .top .title em{height:20px; font-size: 16px; overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 200px;
        width: 100%;
        display: block;}
    .box-list-wrap .box-list .normal .txt-wrap .top .star-rating{margin-top: 10px;}
    .box-list-wrap .box-list .normal .txt-wrap .top .star-rating .star img{width: 13px;}
    .box-list-wrap .box-list .normal .txt-wrap .top .price{margin-top: 10px;}
    .box-list-wrap .box-list .normal .txt-wrap .top .price p{font-size: 14px;}
    .box-list-wrap .box-list .normal .txt-wrap .top .price p strong{font-size: 20px;}
    .box-list-wrap .box-list .normal .txt-wrap .btm{padding-top:15px;}
    .box-list-wrap .box-list .normal .txt-wrap .btm .lecturer b{padding-left:17px; font-size: 12px;}
    .box-list-wrap .box-list .normal .txt-wrap .btm .lecturer b:before{margin-top:-6px; width: 12px; height:12px;}
    .box-list-wrap .swiper{overflow: visible;}
    .box-list-wrap .swiper-util{display: none;}
    
    .box-list .normal .txt-wrap .inner{padding: 20px;}
    .box-list > ul:not(.swiper-wrapper){margin: -10px -7.5px;}
    .box-list > ul:not(.swiper-wrapper) > li{width: 50%; padding: 10px 7.5px;}
    .box-list .normal .txt-wrap .top{padding-bottom: 15px;}
    .box-list .normal .txt-wrap .btm .btn-favorite{display: block;}
    .box-list .hover{display: none !important;}

    .book-list ul:not(.swiper-wrapper){margin: -10px -5px;}
    .book-list ul:not(.swiper-wrapper) > li{width: 50%; padding: 10px 5px;}
    .book-list ul > li a{padding: 50px 20px;}
    .book-list ul > li .img-wrap .img{display:inline-block; max-height: 340px; background-size: auto 100%;}

    .search-top{display: none;}

    .inner-box{padding: 20px;}

    .block-list ul li{display:block; border: none; border-radius: 0; overflow: auto; margin-top: 20px;}
    .block-list ul li.row .col{display: block; border-left: none; margin-top: 20px;}
    .block-list ul li.row .col:first-of-type{margin-top: 0;}
    .block-list ul li .list-tit{display: block; width: 100%; padding: 0; background-color: #fff;}
    .block-list ul li .list-tit b{font-size: 14px; line-height: 1.2;}
    .block-list ul li .list-con{margin-top:8px; min-height:50px; padding: 15px; border-radius: 10px; border: 1px solid #ececec; background-color: #f8f8f8;}
    .block-list ul li .list-con.long{height: auto;}
    .block-list ul li .list-con p{font-size: 14px;}

    .check-label-list ul{margin: 0 -3px;}
    .check-label-list ul li{padding: 0 3px;}
    .check-label-list ul li input[type="radio"] + label{padding:0 15px; height: 50px; line-height: 50px; font-size: 14px;}

    input[type='text'], input[type='password'], 
    input[type='tel'], input[type='email'], 
    input[type='number'], input[type='url'],
    select, input[type="time"], textarea{height: 50px; padding: 0 15px; font-size: 14px;}

    input[type='text']::placeholder, input[type='password']::placeholder, 
    input[type='tel']::placeholder, input[type='email']::placeholder, 
    input[type='number']::placeholder, input[type='url']::placeholder,
    input[type="time"]::placeholder, textarea::placeholder{font-size: 14px;}

    .input-date:before{margin-top: -9px; width: 18px; height: 18px;}
    .input-time:before{margin-top: -9px; width: 18px; height: 18px;}
    .input-btn input[type="text"]{padding-right: 101px;}
    .input-btn button{right:5px; margin-top:-20px; width: 91px; height: 40px; line-height: 40px;}

    .textarea textarea{padding: 15px;}
    
    .form-wrap .form-row{margin-top: 20px;}
    .form-wrap .form-row:has(.col){display: block;}
    .form-wrap .form-row:has(.col) .col{margin-top: 20px;}
    .form-wrap .form-row:has(.col) .col:first-of-type{margin-top: 0;}
    
    .form-wrap .form-label label{font-size: 14px;}
    
    .form-file .form-file-text{padding-left:15px; padding-right:101px; height: 50px;}
    .form-file .form-file-text p{font-size: 14px;}
    .form-file > label{right: 5px; margin-top:-20px; width: 91px; height: 40px; line-height: 40px;}

    .caution p{font-size: 12px;}

    .btn-btm a,
    .btn-btm button{width: 150px; height: 50px; line-height: 50px; border-radius: 25px; font-size: 14px;}

    .faq-list ul li{padding: 20px;}
    .faq-list ul li .list-tit em{padding-left:28px; font-size: 14px;}
    .faq-list ul li .list-con .answer{padding-left: 28px;}
    .faq-list ul li .list-tit em:before,
    .faq-list ul li .list-con .answer:before{font-size: 20px;}
    .faq-list ul li .list-tit button img{width: 14px;}

    .check-box-list-wrap > a{display: block;}
    .check-box-list-wrap > a.on + .check-box-list{display: block;}
    .check-box-list-wrap > .check-box-list{display:none; margin-top:5px !important; padding: 15px; border-radius: 10px; border: 1px solid #ececec; background-color: #fff; box-sizing: border-box;}
    .check-box-list-wrap > .check-box-list ul{margin: -5px -2.5px !important; row-gap: 0 !important;}
    .check-box-list-wrap > .check-box-list ul li{width: 50% !important; padding: 5px 2.5px; box-sizing: border-box;}
    .check-box-list-wrap > .check-box-list ul li.check-box label{padding-left: 25px; font-size: 14px;}
    .check-box-list-wrap > .check-box-list ul li.check-box label:before{width: 20px; height: 20px; margin-top: -10px;}

    .form-select > a{padding:0 15px; height: 50px; line-height: 48px; font-size: 14px;}
    .form-select > a:before{right:15px; margin-top:-4px; width:12px; height:8px;}
    .form-select > ul{top: 49px;}
    .form-select > ul li a{padding:0 15px; height: 50px; line-height: 50px; font-size: 14px;}

    .table-wrap .table-head{display: none;}
    .table-wrap .table-body > ul > li{display: block; height: auto; text-align: left; padding: 20px; margin-top: 20px;}
    .table-wrap .table-body > ul > li:first-of-type{margin-top: 0;}
    .table-wrap .table-body > ul > li > div{display:flex; justify-content: left; align-items: center; gap:30px; width: 100% !important; padding: 17px 0; border-top: 1px solid #ececec;}
    .table-wrap .table-body > ul > li > div.type{padding-top:0; border-top: none;}
    .table-wrap .table-body > ul > li p{font-size: 14px;}
    .table-wrap .table-body > ul > li .mo-tit{display: block; width: 112px; flex: none;}

    .inner-box:has(.preview){flex-direction: column-reverse; align-items: flex-start; gap: 10px;}
    .preview{gap: 30px;}
    .preview .txt-wrap .title em{font-size: 16px;}
    
    #sub.inquiry .table-wrap .num{display: none;}
    #sub.inquiry .table-wrap .answer{padding: 0; padding-top: 10px; border-top: none;}
    #sub.inquiry .table-wrap .answer > a{width: 100%; height: 50px; line-height: 50px;}

    #sub.request .table-wrap .width-wrap{display:block; width: 100%;}
    #sub.request .table-wrap .width-wrap > div{display:flex; justify-content: left; align-items: flex-start; gap:30px; width:100%; padding: 17px 0 !important; border-top: 1px solid #ececec;}
    #sub.request .table-wrap .table-body .lecture-infor{border-top: none; padding-top: 0 !important;}
    #sub.request .table-wrap .table-body .apply-infor .mo-infor{display: flex; gap: 23px;}
    #sub.request .table-wrap .table-body .apply-infor .mo-infor p{position: relative;}
    #sub.request .table-wrap .table-body .apply-infor .mo-infor p:before{content:''; display: block; position:absolute; left: -12px; top: 4px; width: 1px; height: 11px; background-color: #ddd;}
    #sub.request .table-wrap .table-body .apply-infor .mo-infor p:first-of-type:before{display: none;}
    #sub.request .table-wrap .status{padding: 0; padding-top: 10px; border-top: none; flex-direction: row; gap: 6px;}
    #sub.request .table-wrap .status span,
    #sub.request .table-wrap .status button{width: 100%; height: 50px; line-height: 50px; font-size: 14px; text-align: center;}
    #sub.request .table-wrap .status span.receipt{line-height: 48px;}

    

    /* popup */
    .btn-popup-close{right: 10px; top: 10px;}
    .btn-popup-close button{width: 36px; height: 36px;}
    .btn-popup-close button img{width: 36px;}

    .popup-box .pop-tit strong,
    .popup-box .pop-tit.big strong{font-size: 18px;}

    #popup-share .popup-inner{max-width: 350px;}
    #popup-share .popup-box{padding: 40px 20px 20px;}
    #popup-share .pop-con{margin-top: 20px;}
    #popup-share .sns-list > ul img{width: 50px;}
    #popup-share .share-link{flex-direction: column;}
    #popup-share .share-link .input input[type="text"]{height: 50px;}
    #popup-share .share-link button{height: 50px; font-size: 14px;}

    #popup-apply .popup-inner{max-width: 350px;}
    #popup-apply .popup-box{padding: 40px 20px 20px; max-height: 530px;}
    #popup-apply .pop-con{margin-top: 20px;}
    #popup-apply .form-wrap .input-gap-btn{gap: 5px;}
    #popup-apply .form-wrap .input-gap-btn button{width: 80px; height: 50px;}
    #popup-apply .btn-apply{margin-top: 30px;}
    #popup-apply .btn-apply button[type="submit"]{width: 150px; height: 50px; border-radius: 25px; font-size: 14px;}
    
    [id ^="popup-password"] .popup-inner{max-width: 350px;}
    [id ^="popup-password"] .pop-con{margin-top: 20px;}
    [id ^="popup-password"] .form-wrap .input input[type="password"]{height: 50px;}
    [id ^="popup-password"] .form-wrap .btn-submit{margin-top: 10px;}
    [id ^="popup-password"] .form-wrap .btn-submit button[type="submit"]{height: 50px; font-size: 14px;}

    /* main */
    #main .main-bg{height: 287px;}

    #main .sec-tit h2{font-size: 24px;}
    #main .tit-link h2 a{padding-right: 26px;}
    #main .tit-link h2 a:before{margin-top:-12px; width: 24px; height: 24px;}
    #main .sec-con{margin-top: 20px;}

    #main .btn-more{margin-top: 40px;}
    #main .btn-more > a{padding:0 20px; max-width: 100%; height: 60px; line-height: 60px;}
    #main .btn-more > a span{font-size: 14px;}
    
    #main .section1{margin-top: 50px;}
    #main .section2{margin:50px 0;}
    #main .section3{margin: 0; padding:50px 0; background-color: #f8f8f8;}
    #main .section3 .review-list > ul > li{width: 50%;}
    #main .section3 .review-list .top{padding-bottom: 15px;}
    #main .section3 .review-list .top .txt-wrap .title em{height:20px; font-size: 16px;}
    #main .section3 .review-list .top .txt-wrap .content p{height: 63px; font-size: 14px;}
    #main .section3 .review-list .top .course{margin-top: 15px;}
    #main .section3 .review-list .btm{padding-top: 15px;}
    #main .section3 .review-list .btm .img-list > ul{gap: 6px;}
    #main .section3 .review-list .btm .img-list .img img{max-width: 71px;}
    #main .section3 .review-list .btm .btn-link{margin-top: 15px;}
    #main .section3 .review-list .btm .btn-link > a{height: 50px; line-height: 50px; font-size: 14px;}
    #main .section4{padding: 50px 0;}
    #main .section4 .book-list > ul > li .inner{padding-top: 0;}
    #main .section4 .book-list > ul > li:hover a{top: 0;}

    /* sub */
    #sub{padding-top: 60px;}

    #sub .sub-visual{height: 252px;}
    #sub .sub-visual .txt-wrap{padding-top: 30px;}
    #sub .sub-visual .sub-refer{margin-top: 25px !important;}
    #sub .sub-visual .sub-refer em{font-size: 18px;}
    #sub .sub-visual .sub-refer p{margin-top:5px; font-size: 12px; line-height: 1.4;}
    #sub .sub-visual .sub-refer p .inb{display: block;}

    #sub .dot-title h2{font-size: 28px;}
    #sub .dot-title h2 span{padding-right: 13px;}
    #sub .dot-title h2 span:before{width: 8px; height: 8px;}

    #sub .sub-title .txt-wrap{padding: 30px 0;}
    #sub .sub-title .sub-refer,
    #sub.enterprise .sub-title .sub-refer{margin-top: 10px;}
    #sub .sub-title .sub-refer p,
    #sub.enterprise .sub-title .sub-refer p{font-size: 16px;}

    /* hr */
    #sub.hr .condition-search{margin-top: -87px;}
    #sub.hr .sec-wrap{padding: 40px 0 120px;}
    #sub.hr .pagination{margin-top: 40px;}

    /* view */
    #sub.view .sub-wrap{padding: 30px 0 120px;}
    #sub.view .sec-wrap > .size{display: flex; flex-direction: column-reverse;}
    
    #sub.view section .sec-tit i{font-size: 12px;}
    #sub.view section .sec-tit strong{font-size: 22px;}
    #sub.view section .sec-con{margin-top: 15px;}
    
    #sub.view .left{padding-right: 0;}
    #sub.view .left .top-banner{display: none;}
    #sub.view .left .tab-tit ul li{height: 52px; line-height: 52px;}
    #sub.view .left .tab-tit ul li a{font-size: 14px;}
    #sub.view .left .tab-con{padding: 40px 0 50px;}
    #sub.view .left .tab-con > section{margin-top: 50px;}

    #sub.view .left .section-intro .btm .tag-list li{padding: 9px 15px; border-radius: 16px;}
    #sub.view .left .section-table .sec-tit .total{font-size: 14px;}
    #sub.view .left .section-table .table-box > ul{border-radius: 0; border: none; background-color: transparent; overflow: auto;}
    #sub.view .left .section-table .table-box > ul > li{display:block; margin-top: 20px; border: 1px solid #ececec; border-radius: 10px; overflow: hidden;}
    #sub.view .left .section-table .table-box > ul > li:first-of-type{border: 1px solid #ececec; margin-top: 0;}
    #sub.view .left .section-table .table-box .list-tit{display:block; width: 100%; border-right: none;}
    #sub.view .left .section-table .table-box .list-tit .inner{display:flex; justify-content: left; align-items: center; gap: 10px; padding: 17px 20px; background-color: #f8faf8;}
    #sub.view .left .section-table .table-box .list-tit .block{margin: 0;}
    #sub.view .left .section-table .table-box .list-tit .txt{display:flex; justify-content: left; align-items: center; gap: 5px; margin-top: 0;}
    #sub.view .left .section-table .table-box .list-tit .txt .hour{font-size: 18px;}
    #sub.view .left .section-table .table-box .list-tit .txt .type{margin-top: 0;}
    #sub.view .left .section-table .table-box .list-con > .inner{padding: 20px;}
    #sub.view .left .section-table .table-box .list-con .col-tit strong{font-size: 18px;}
    #sub.view .left .section-table .table-box .list-con .col-con{margin-top: 20px;}
    #sub.view .left .section-table .table-box .list-con .col-con .num-list > ul > li{margin-top: 18px;}
    #sub.view .left .section-table .table-box .list-con .col-con .txt-box .inner{padding: 20px;}
    #sub.view .left .section-instructor .swiper-slide .inner-box{flex-direction: column; gap: 25px;}
    #sub.view .left .section-instructor .mo-pagination{display: flex;}
    #sub.view .left .section-instructor .txt-wrap .txt-tit p{font-size: 20px;}
    #sub.view .left .section-instructor .txt-wrap .txt-con{margin-top: 20px;}
    #sub.view .left .tab-con > section.section-youtube .swiper-slide{margin-top: 30px;}
    #sub.view .left .section-review .stats-wrap{flex-direction: column;}
    #sub.view .left .section-review .stats-wrap .star-avg{width: 100%;}
    #sub.view .left .section-review .stats-wrap .star-avg .inner{height: 135px; padding: 30px 20px;}
    #sub.view .left .section-review .stats-wrap .star-avg .avg{font-size: 26px;}
    #sub.view .left .section-review .stats-wrap .star-avg p{font-size: 14px;}
    #sub.view .left .section-review .stats-wrap .score-ratio .inner{height:auto; padding: 25px 20px;}
    #sub.view .left .section-review .stats-wrap .score-ratio ul li .score{font-size: 14px;}
    #sub.view .left .section-review .review-list > ul{padding: 0 20px;}
    #sub.view .left .section-review .review-list > ul > li{position:relative; display: block;}
    #sub.view .left .section-review .review-list .list-tit{position:absolute; right:0; top:20px; width: auto; padding: 0;}
    #sub.view .left .section-review .review-list .list-tit .name{font-size: 14px; line-height: 1;}
    #sub.view .left .section-review .review-list .list-con{padding: 20px 0;}
    #sub.view .left .section-review .review-list .list-con .util{margin-top: 15px; gap: 10px; align-items: center;}
    #sub.view .left .section-review .review-list .list-con .img-list{margin-top: 15px;}
    #sub.view .left .section-review .review-list .list-con .img-list > ul{gap: 6px;}
    #sub.view .left .section-review .review-list .list-con .img-list .img img{width: 71px;}
    #sub.view .left .section-review .pagination{margin-top: 25px;}
    #sub.view .left .tab-con > section.section-write:has(.form-wrap) .inner-box{padding: 20px;}
    #sub.view .left .tab-con > section.section-write:has(.login-check) .inner-box{padding: 30px 20px;}
    #sub.view .left .section-write .login-check .title em{font-size: 16px;}
    #sub.view .left .section-write .login-check .content{margin-top: 15px;}
    #sub.view .left .section-write .login-check .content [class ^="btn-"] a{width:150px; height: 50px; line-height: 50px; border-radius: 25px; font-size: 14px;}
    #sub.view .left .tab-con > section.section-write .btn-btm{margin-top: 30px;}
    #sub.view .left .section-notice .notice-box .box .box-con .check-list ul li{font-size: 14px;}
    #sub.view .left .section-notice .notice-box .box .box-con p{font-size: 14px;}

    #sub.view .right{position: static; width: 100%;}
    #sub.view .right .top-banner{display: block;}
    #sub.view .right .sticky-wrap{position: static; margin-top: 20px;}
    #sub.view .right .sticky-wrap > .inner{box-shadow: none;}
    #sub.view .right .sticky-wrap .top .title strong{font-size: 18px;}
    #sub.view .right .sticky-wrap .btm{display: none;}
    #sub.view .section-fixed{display: block;}
    #sub.view + #footer{padding-bottom: 90px;}

    #sub.view-apply .left{margin-top: 20px;}

    /* project */
    #sub.project .title i{font-size: 14px;}
    #sub.project .title .big{margin-top: 12px;}
    #sub.project .title .big h3{font-size: 24px;}

    #sub.project .content{margin-top: 14px;}
    #sub.project .content p{margin-top:13px; font-size: 14px;}
    #sub.project .content p .dpb{display: block;}

    #sub.project .section1{padding-bottom: 45px;}
    #sub.project .section1 .box-wrap{flex-direction: column; gap: 25px;}
    #sub.project .section1 .sub-tit p{font-size: 18px;}

    #sub.project .section2{padding: 50px 0;}
    #sub.project .section2 .box-wrap{gap: 30px; flex-direction: column !important; align-items: flex-start;}
    #sub.project .section2 .content{margin-top: 22px;}
    #sub.project .section2 .content P{margin-top: 14px;}
    #sub.project .section2 .txt-wrap,
    #sub.project .section2 .img-wrap{width: 100%;}

    /* introduce */
    #sub.introduce [class ^="section"]{padding: 50px 0;}
    #sub.introduce .sec-tit i:not(.dpb):not(.inb){font-size: 14px; margin-bottom: 10px;}
    #sub.introduce .sec-tit .big h3{font-size: 24px;}
    #sub.introduce .sec-tit p{font-size: 18px;}
    #sub.introduce .sec-tit p .inb{display: block;}

    #sub.introduce .txt-wrap .title em{font-size: 24px;}
    #sub.introduce .txt-wrap .content{margin-top: 25px;}
    #sub.introduce .txt-wrap .content p{font-size: 14px; margin-top: 15px;}
    #sub.introduce .txt-wrap .content p .dpb{display: block;}

    #sub.introduce .section1 .sec-con{gap:30px; flex-direction: column; align-items: flex-start;}

    #sub.introduce .section2 .sec-con{gap:35px; margin-top: 35px;}
    #sub.introduce .section2 .txt-wrap .content p{margin-top: 5px;}

    #sub.introduce .section3 .sec-con{flex-direction: column;}
    #sub.introduce .section3 .box{margin-top: 25px;}
    #sub.introduce .section3 .box .box-tit p{font-size: 18px;}
	#sub.introduce .section3 .box .box-con{margin-top:15px;}
    #sub.introduce .section3 .txt-wrap .content{margin-top: 25px;}
    #sub.introduce .section3 .img-wrap{margin-top: 20px;}
    #sub.introduce .section3 .img-wrap .img{margin-bottom: -120px;}
    
    #sub.introduce .section4{padding-top: 120px;}
    #sub.introduce .section4 .sec-con{margin-top: 40px; gap:35px; flex-direction: column;}
    #sub.introduce .section4 .txt-wrap .title em{font-size: 18px;}
    #sub.introduce .section4 .txt-wrap .content{margin-top: 15px;}
    #sub.introduce .section4 .txt-wrap .content p{margin-top: 10px;}

    #sub.introduce .section5 .sec-tit span{font-size: 14px;}
    #sub.introduce .section5 .sec-tit span .inb{display: block;}
    #sub.introduce .section5 .sec-tit h3{margin-top:15px; font-size: 20px;}
    #sub.introduce .section5 .sec-con{margin-top: 50px;}
    #sub.introduce .section5 .btn-list{gap: 10px;}
    #sub.introduce .section5 .btn-list a{width: 110px; height: 110px; gap: 8px;}
    #sub.introduce .section5 .btn-list a .ico img{width: 32px;}
    #sub.introduce .section5 .btn-list a b{font-size: 13px;}

    /* member */
    #sub.member .member-inner{padding: 60px;}
    #sub.member .sec-tit h2{font-size: 28px;}
    #sub.member [class ^="btn-"] > a,
    #sub.member [class ^="btn-"] > button{height:55px; line-height:55px; font-size: 14px;}

    #sub.login .join-wrap .txt-wrap .title em{font-size: 20px;}
    #sub.login .join-wrap .txt-wrap .content p{font-size: 14px;}

    #sub.join .check-all .check-box label{padding: 15px 15px;}
    #sub.join .check-all .check-box label:before{left: 15px; margin-top:-12px; width: 24px; height: 24px;}
    #sub.join .check-list ul li .inner{padding: 14px 15px;}
    #sub.join .check-list ul li .check-box{min-height: 20px;}
    #sub.join .check-list ul li .check-box label{padding-left: 25px; font-size: 14px;}
    #sub.join .check-list ul li .check-box label:before{width: 20px; height: 20px; margin-top: -10px;}
    
    /* inquiry */
    #sub.inquiry .sec-wrap{padding-bottom: 120px;}
    #sub.inquiry-idx .form-wrap{padding: 40px 20px;}
    #sub.inquiry-idx .form-same{margin: 20px 0 10px;}

    /* mypage */
    #sub.mypage .content-wrap .cont-tit h3{font-size: 22px;}
    #sub.mypage .content-wrap .cont-box{margin-top: 20px;}
    #sub.mypage .form-wrap .form-box{padding: 40px 20px;}    
    
    #sub.request .tab-tit > ul{gap: 6px;}
    #sub.request .tab-tit > ul > li > a{height: 50px; line-height: 48px; font-size: 14px;}
    #sub.request .status-list{margin-top: 20px;}
    #sub.request .status-list > ul{gap: 24px;}
    #sub.request .status-list > ul > li > a{font-size: 14px;}
    #sub.request .table-wrap{margin-top: 30px;}
    #sub.request .table-wrap .table-top em{font-size: 14px;}
    #sub.request .table-wrap .table-box{margin-top: 12px;}

    #sub.request-view .sec-tit h4{font-size: 20px;}
    #sub.request-view .block-list ul li.row .col{border: none; border-radius: 0; overflow: visible;}
    #sub.request-view .cont-box > section{margin-top: 20px;}
    #sub.request-view .section-step .sec-con > .inner-box{padding: 20px;}
    #sub.request-view .section-step .step-list > ul{margin: 0 -15px;}
    #sub.request-view .section-step .step-list > ul > li{padding: 0 15px;}
    #sub.request-view .section-step .step-list > ul > li:before{left:-5px; margin-top:-8.5px; width: 10px; height: 17px;}
    #sub.request-view .section-step .step-list > ul > li .inner{padding: 0 20px; height: 55px; border-radius: 27.5px;}
    #sub.request-view .section-step .step-list > ul > li i{font-size: 12px;}
    #sub.request-view .section-step .step-list > ul > li b{font-size: 14px;}
    #sub.request-view .section-step .box-wrap{margin-top: 20px;}
    #sub.request-view .section-step .box-tit em{font-size: 16px;}
    #sub.request-view .section-step .box-img .txt p{font-size: 16px;}
    #sub.request-view .section-step .memo-wrap .content .inner{padding: 15px;}
    #sub.request-view .section-step .memo-wrap .content p{font-size: 14px;}
    #sub.request-view .price-total .inner-box{height: 75px;}
    #sub.request-view .price-total b{font-size: 14px;}
    #sub.request-view .btn-btm{margin-top: 20px;}    
    #sub.request-enterprise .guide-wrap p{font-size: 14px;}

    #sub.mypage.inquiry .search-wrap .search-tit{width: 120px;}
    #sub.mypage.inquiry .search-wrap .search-con{flex-direction: column;}
    #sub.mypage.inquiry .search-wrap .btn-wrap{width: 100% !important;}
    #sub.mypage.inquiry .search-wrap .top .btn-wrap .btn-submit{width: 100%;}
    #sub.mypage.inquiry .search-wrap .btn-submit button[type="submit"]{width: 100%;}
}

@media screen and (max-width: 768px){
    .mo{display:block;}
    .pcta{display: none;}

    html{font-size: 56%;}

    /* main */
    #main .main-banner-swiper .swiper-slide .txt .inner{gap: 15px;}
    #main .main-banner-swiper .swiper-slide .txt .big em{font-size: 18px;}
    #main .main-banner-swiper .swiper-slide .txt .small p{font-size: 12px;}
    #main .main-banner-swiper .swiper-util{right: 10px; bottom: 10px;}
    #main .main-banner-swiper .swiper-util .inner{padding: 5px 12px;}
    #main .main-banner-swiper .swiper-util .banner-fraction p{font-size: 11px;}
    #main .main-banner-swiper .swiper-util .arrow{display: none;}

    /* common */
    .pagination{gap: 10px;}
    .pagination.pcta{display:none;}
    .pagination.mo{display: flex;}
    .pagination > ul a{width: 32px; height: 32px; line-height: 32px;}
    .pagination > ul.btn-move{gap: 0;}
    .pagination > ul.btn-num{gap: 3px;}
    .pagination > ul.btn-num a{font-size: 13px;}

    /* sub */
    /* mypage */
    #sub.favorite .box-list > ul:not(.swiper-wrapper) > li{width: 50%;}
    
}
@media screen and (max-width: 640px){
    html{font-size: 54%;}

    /* common */
    .search-filter .mid .filter-list .depth2 .check-box-list ul li{width: 50%;}

    /* sub */
    #sub.project .content p .dpb{display: inline;}
    #sub.introduce .txt-wrap .content p .dpb{display: inline;}

    /* mypage */
    #sub.request-view .section-step .step-list > ul{margin: -5px -15px; flex-wrap: wrap;}
    #sub.request-view .section-step .step-list > ul > li{width:50%; padding: 5px 15px; box-sizing: border-box;}
    #sub.request-view .section-step .step-list > ul > li:nth-of-type(odd):before{display: none;}
    #sub.request-view .section-step .payment-list .check-label-list ul{gap: 0; margin: 0 -2.5px;}
    #sub.request-view .section-step .payment-list .check-label-list ul li{width: 33.3333%; padding: 0 2.5px;}
    #sub.request-view .section-step .payment-list .check-label-list ul li input[type="radio"] + label{width: 100%; font-size: 14px;}

    #sub.mypage.inquiry .search-wrap > div{display: block;}
    #sub.mypage.inquiry .search-wrap .search-tit{width: 100%;}
}
@media screen and (max-width: 480px){
    html{font-size: 45%;}

    /* common */ 
    .box-list > ul:not(.swiper-wrapper) > li{width: 100%;}
    .book-list ul:not(.swiper-wrapper) > li{width: 100%;}


    /* sub */
    #sub.view .left .tab-tit ul{gap: unset; justify-content: space-between;}
    #sub.view .left .section-write .login-check .content{width: 100%; gap: 6px;}
    #sub.view .left .section-write .login-check .content > div{width: 100%;}
    #sub.view .left .section-write .login-check .content [class ^="btn-"] a{width: 100%;}

    /* member */
    #sub.member .member-inner{padding: 40px 20px;}
    #sub.login .login-util .check-box label{padding-left: 25px; font-size: 14px;}
    #sub.login .login-util .check-box label:before{width: 20px; height: 20px; margin-top: -10px;}

    #sub.inquiry-idx .btn-wrap{gap: 5px;}
    #sub.inquiry-idx .btn-wrap > div,
    #sub.inquiry-idx .btn-wrap > div *{width: 100%;}

    /* mypage */
    #sub.request .status-list > ul{gap: unset; justify-content: space-between;}
    #sub.request-view .section-step .payment-list .check-label-list ul{margin: -2.5px; flex-wrap: wrap;}
    #sub.request-view .section-step .payment-list .check-label-list ul li{width:100%; padding: 2.5px;}
    #sub.request-view .price-total .inner-box{display: block; padding-bottom: 15px; height: auto;}
    #sub.request-view .btn-btm{gap: 6px;}
    #sub.request-view .btn-btm > div,
    #sub.request-view .btn-btm > div * {width: 100%;}

    #sub.favorite .box-list > ul:not(.swiper-wrapper) > li{width: 100%;}
}
@media screen and (max-width: 390px){
    .popup-inner{margin: 20px;}
}
@media screen and (max-width: 320px){
    html{font-size: 42%;}
}@charset "utf-8";
/* CSS Document */

/**
 * Swiper 5.2.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://swiperjs.com
 *
 * Copyright 2014-2019 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: October 26, 2019
 */

@font-face {
  font-family: 'swiper-icons';
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}
.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}
.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}
.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}
.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
/* 3D Effects */
.swiper-container-3d {
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
/* CSS Mode */
.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  left: 10px;
  right: auto;
}
.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}
.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
  content: 'next';
}
.swiper-button-prev.swiper-button-white,
.swiper-button-next.swiper-button-white {
  --swiper-navigation-color: #ffffff;
}
.swiper-button-prev.swiper-button-black,
.swiper-button-next.swiper-button-black {
  --swiper-navigation-color: #000000;
}
.swiper-button-lock {
  display: none;
}
:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  */
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #fff;
  opacity: 0.5;
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet-active {
  opacity: 1;
   background: #fff;
  /* background: var(--swiper-pagination-color, var(--swiper-theme-color)); */
}
.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform, 200ms top;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms left;
}
.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms right;
}
/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progressbar,
.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-container-vertical > .swiper-pagination-progressbar,
.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-white {
  --swiper-pagination-color: #ffffff;
}
.swiper-pagination-black {
  --swiper-pagination-color: #000000;
}
.swiper-pagination-lock {
  display: none;
}
/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-scrollbar-lock {
  display: none;
}
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.swiper-slide-zoomed {
  cursor: move;
}
/* Preloader */
:root {
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  */
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  animation: swiper-preloader-spin 1s infinite linear;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube {
  overflow: visible;
}
.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
  transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}
.swiper-container-flip {
  overflow: visible;
}
.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
}
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}/**
vendor
*/
/**
 * Swiper 6.3.5
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2020 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: October 30, 2020
 */

@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA') format('woff');
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}
.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}
.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}
.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}
.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
/* 3D Effects */
.swiper-container-3d {
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
/* CSS Mode */
.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  left: 10px;
  right: auto;
}
.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}
.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
  content: 'next';
}
.swiper-button-prev.swiper-button-white,
.swiper-button-next.swiper-button-white {
  --swiper-navigation-color: #ffffff;
}
.swiper-button-prev.swiper-button-black,
.swiper-button-next.swiper-button-black {
  --swiper-navigation-color: #000000;
}
.swiper-button-lock {
  display: none;
}
:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  */
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform, 200ms top;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms left;
}
.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms right;
}
/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progressbar,
.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-container-vertical > .swiper-pagination-progressbar,
.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-white {
  --swiper-pagination-color: #ffffff;
}
.swiper-pagination-black {
  --swiper-pagination-color: #000000;
}
.swiper-pagination-lock {
  display: none;
}
/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-scrollbar-lock {
  display: none;
}
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.swiper-slide-zoomed {
  cursor: move;
}
/* Preloader */
:root {
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  */
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  animation: swiper-preloader-spin 1s infinite linear;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube {
  overflow: visible;
}
.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
  transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}
.swiper-container-flip {
  overflow: visible;
}
.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
}
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}