@charset "utf-8";
@import url('fonts.css');
@import url('aos.css');
@import url('//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css');
@import url('//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css');
@font-face {
    font-family: 'MaplestoryOTFBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/MaplestoryOTFBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'KOTRAHOPE';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2110@1.0/KOTRAHOPE.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* ==========
media
1600px, 1200px, 1000px, 768px, 560px
========== */

/* === CSS reset === */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
/* table, caption, tbody, tfoot, thead, tr, th, td, */
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main, summary,
time, mark, audio, video{ margin:0; padding:0; border:0; outline:0; background: transparent; box-sizing: border-box; }
html{ -webkit-font-smoothing: subpixel-antialiased; -webkit-tap-highlight-color: transparent;  min-width:320px;}
body{ -webkit-text-size-adjust: none; /*overflow-x:hidden; overflow-y:auto;*/}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main{display:block;}
ul,ol,li{list-style:none;}
a{ margin:0; padding:0; border:0; outline:0; text-decoration:none !important; color:inherit; }
table{ border-collapse:collapse; border-spacing:0; }
hr{ display:block; height:1px; border:0; border-top:1px solid #f5f5f5; margin:1rem 0; padding:0; }
img{border:0; max-width:100%; vertical-align:middle;}
em{font-style:normal;}
input, textarea, button{ -webkit-appearance:none; -moz-appearance:none; appearance:none; }
input, textarea, button, select{ border-radius:0; }
button{ border:none; outline:none; background:none; cursor:pointer; }
input, select{vertical-align:middle;}
input:required, input:invalid{ /*border:0 none;*/ outline: 0 none; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow: none; }
address, cite, dfn, em, var{font-style: normal;}
blockquote, q{quotes: none;}
blockquote:before, blockquote:after, q:before, q:after{content:''; content: none;}
sup{vertical-align: text-top;}
sub{vertical-align: text-bottom;}
embed{ /*for the damn thouder plugin*/ display:none; }

/* === form CSS reset cross browsing === */

select::-ms-expand {display:none}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration{display:none;}
input:-moz-submit-invalid{box-shadow: none;}
input:-moz-ui-invalid{box-shadow:none;}

/* === Common === */

:root {
	--color-main:	#4680ff;
	--color-main-a: rgba(70,128,255,0.5);
	--color-main-b: rgba(70,128,255,0.25);
	--color-main-bg:rgba(70,128,255,0.1);
	--color-sub:	#119dde;
	--color-sub-bg:	rgba(17,157,222,0.1);

	--color-default: #BDC3C7;		--color-default-bg: #fafafa;
	--color-primary: #4680ff;		--color-primary-bg: #79a3ff;
	--color-success: #93BE52;		--color-success-bg: #aacc77;
	--color-info:	 #62d1f3;		--color-info-bg:	#91dff7;
	--color-warning: #FFB64D;		--color-warning-bg: #ffcb80;
	--color-danger:  #FC6180;		--color-danger-bg:  #fd93a8;
	--color-inverse: #303548;		--color-inverse-bg: #444c67;
	--color-admin:	 #a55eea;		--color-admin-bg:	#d579ff;

	--color-tone-100 : #f8f8f8; 
	--color-tone-200 : #e9e9e9;
	--color-tone-300 : #dedede;
	--color-tone-400 : #cecece; 
	--color-tone-500 : #adadad; 
	--color-tone-600 : #6c6c6c;
	--color-tone-700 : #494949;
	--color-tone-800 : #343434;
	--color-tone-900 : #212121;

	--color-gray-0 :	#f8f9fa;	--color-gray-1 :	#f1f3f5;	--color-gray-2 :	#e9ecef;	--color-gray-3 :	#dee2e6;	--color-gray-4 :	#ced4da;
	--color-gray-5 :	#adb5bd;	--color-gray-6 :	#868e96;	--color-gray-7 :	#495057;	--color-gray-8 :	#343a40;	--color-gray-9 :	#212529;
	--color-red-0 :		#fff5f5;	--color-red-1 :		#ffe3e3;	--color-red-3 :		#ffa8a8;	--color-red-5 :		#ff6b6b;	--color-red-7 :		#f03e3e;	--color-red-9 :		#c92a2a;	/* danger */
	--color-pink-0 :	#fff0f6;	--color-pink-1 :	#ffdeeb;	--color-pink-3 :	#faa2c1;	--color-pink-5 :	#f06595;	--color-pink-7 :	#d6336c;	--color-pink-9 :	#a61e4d;
	--color-grape-0 :	#f8f0fc;	--color-grape-1 :	#f3d9fa;	--color-grape-3 :	#e599f7;	--color-grape-5 :	#cc5de8;	--color-grape-7 :	#ae3ec9;	--color-grape-9 :	#862e9c;	/* admin */
	--color-violet-0 :	#f3f0ff;	--color-violet-1 :	#e5dbff;	--color-violet-3 :	#b197fc;	--color-violet-5 :	#845ef7;	--color-violet-7 :	#7048e8;	--color-violet-9 :	#5f3dc4;
	--color-indigo-0 :	#edf2ff;	--color-indigo-1 :	#dbe4ff;	--color-indigo-3 :	#91a7ff;	--color-indigo-5 :	#5c7cfa;	--color-indigo-7 :	#4263eb;	--color-indigo-9 :	#364fc7;	/* inverse */
	--color-blue-0 :	#e7f5ff;	--color-blue-1 :	#d0ebff;	--color-blue-3 :	#74c0fc;	--color-blue-5 :	#339af0;	--color-blue-7 :	#1c7ed6;	--color-blue-9 :	#1864ab;	/* primary */
	--color-cyan-0 :	#e3fafc;	--color-cyan-1 :	#c5f6fa;	--color-cyan-3 :	#66d9e8;	--color-cyan-5 :	#22b8cf;	--color-cyan-7 :	#1098ad;	--color-cyan-9 :	#0b7285;	/* info */
	--color-teal-0 :	#e6fcf5;	--color-teal-1 :	#c3fae8;	--color-teal-3 :	#63e6be;	--color-teal-5 :	#20c997;	--color-teal-7 :	#0ca678;	--color-teal-9 :	#087f5b;
	--color-green-0 :	#ebfbee;	--color-green-1 :	#d3f9d8;	--color-green-3 :	#8ce99a;	--color-green-5 :	#51cf66;	--color-green-7 :	#37b24d;	--color-green-9 :	#2b8a3e;	/* success */
	--color-lime-0 :	#f4fce3;	--color-lime-1 :	#e9fac8;	--color-lime-3 :	#c0eb75;	--color-lime-5 :	#94d82d;	--color-lime-7 :	#74b816;	--color-lime-9 :	#5c940d;
	--color-yellow-0 :	#fff9db;	--color-yellow-1 :	#fff3bf;	--color-yellow-3 :	#ffe066;	--color-yellow-5 :	#fcc419;	--color-yellow-7 :	#f59f00;	--color-yellow-9 :	#e67700;	/* warning */
	--color-orange-0 :	#fff4e6;	--color-orange-1 :	#ffe8cc;	--color-orange-3 :	#ffc078;	--color-orange-5 :	#ff922b;	--color-orange-7 :	#f76707;	--color-orange-9 :	#d9480f;

	--color-trans-wh : rgba(255,255,255,0.9);
	--color-trans-bk : rgba(0,0,0,0.5);

	--font-title :	'Montserrat', 'Spoqa Han Sans Neo', 'SUIT', 'Pretendard', 'Noto Sans KR', sans-serif;
	--font-text :	'Spoqa Han Sans Neo', 'Roboto', 'Pretendard', 'Noto Sans KR', 'AppleGothic', '맑은 고딕', 'Malgun Gothic', 돋움, Dotum, sans-serif;
	--font-gothic :	'SBAggro', 'Montserrat', 'Spoqa Han Sans Neo', 'SUIT', 'Pretendard', 'Noto Sans KR', sans-serif;
	--font-hand :	'Cafe24Supermagic', 'Montserrat', 'Spoqa Han Sans Neo', 'SUIT', 'Pretendard', 'Noto Sans KR', sans-serif;
	--font-mono :	'Roboto Mono', 'Roboto', 'Pretendard', 'Noto Sans Mono', 'Noto Sans KR', sans-serif;
	--font-icon-awe : 'Font Awesome 6 free', 'Spoqa Han Sans Neo', 'Noto Sans KR', sans-serif;
	--font-icon-xei : 'xeicon', 'Spoqa Han Sans Neo', 'Noto Sans KR', sans-serif;

	--transition-slow : all .3s ease-in-out;
	--transition-fast : all .1s ease-in-out;

	--gutter-pc:	50px;
	--gutter-mo:	20px;
	--mg-sec-pc:	140px;
	--mg-sec-md:	70px;
	--mg-sec-mo:	30px;
}

body{ font-size:16px; color:var(--color-tone-700); font-family:var(--font-text); line-height:1.75; width:100%; height:100%; }
input, textarea, button, select { font-family:var(--font-text); }
a { color:var(--color-tone-800); transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
a:hover, a:focus { color:#000; }
a:hover, a:focus,
button:active, button:focus { outline: none !important; box-shadow: none !important; }
.inner { width:80%; height:100%; padding:0 var(--gutter-pc); margin:0 auto; position:relative; }
body::-webkit-scrollbar { width: 8px;  /* 스크롤바의 너비 */ }
body::-webkit-scrollbar-thumb { height: 30%; /* 스크롤바의 길이 */ background: var(--color-tone-600); /* 스크롤바의 색상 */ border-radius: 10px; }
body::-webkit-scrollbar-track { background: var(--color-tone-200); /*스크롤바 뒷 배경 색상*/ }
@media all and (max-width:1200px) {
	body, button, input, optgroup, select, textarea{ font-size:14px; }
	.inner { width:100%; padding:0 var(--gutter-mo); }
}

/* === Component === */

/* trigger */
.menu-trigger, 
.menu-trigger span { display: inline-block; transition: all .4s, background-color .15s ease-in-out; box-sizing: border-box; }
.menu-trigger { position: relative; width: 25px; height: 20px; }
.menu-trigger span { position: absolute; left: 0; width: 100%; height: 2px; background-color:var(--color-tone-700); border-radius: 0; }
.menu-trigger span:nth-of-type(1) {	top: 0; }
.menu-trigger span:nth-of-type(2) { top: 9px; }
.menu-trigger span:nth-of-type(3) { bottom: 0; }
/* 중앙 라인이 고정된 자리에서 투명하게 사라지며 상하라인 회전하며 엑스자 만들기 */
.menu-trigger:hover span { background-color:#000; }
.menu-trigger.active span { background-color:#fff; }
.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(9px) rotate(-45deg);
	transform: translateY(9px) rotate(-45deg); }
.menu-trigger.active span:nth-of-type(2) { opacity: 0; }
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-9px) rotate(45deg);
	transform: translateY(-9px) rotate(45deg); }

/* button */
.btn-box { display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.btn-box.right { position:absolute; top:0; right:0; }
.btn-box.bottom { margin-top:var(--mg-sec-md); }
.btn-box.top { margin-bottom:var(--mg-sec-md); }
.btn-box.center { justify-content:center; }
.btn_confirm { display:flex; align-items:center; justify-content:flex-end; gap:4px; }
.btn_menu { display:none; margin-left:auto; z-index:100; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.btn_more { display:inline-block; border:1px solid var(--color-tone-700); padding:0 1.25em; height:41px; line-height:41px; padding-right:2.5em; border-radius: 3px; 
	font-family:var(--font-title); color:var(--color-tone-700); font-size:1.125em; text-transform:uppercase; position:relative;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.btn_more.wh { color:#fff; border-color:#fff; }
.btn_more.color { color:#fff; border-color:var(--color-main); background:var(--color-main); }
.btn_more.angle:after { content:'\e93e'; font-family:var(--font-icon-xei); position:absolute; top:50%; transform:translateY(-50%); right:1em; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.btn_more.angle:hover:after { right:0.75em; }
.btn_more.plus:after { content:'\e913'; font-family:var(--font-icon-xei); position:absolute; top:50%; transform:translateY(-50%); right:1em; }
.btn_more.plus:hover { border-color:var(--color-tone-900); color:var(--color-tone-900); }
.btn_rectangle { display:inline-block; border:1px solid var(--color-tone-700); padding:0 1.25em; height:41px; line-height:41px; border-radius: 3px;  
	font-family:var(--font-title); font-size:1.125em; text-align:center; color:var(--color-tone-700); text-transform:uppercase;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.btn_rectangle:hover { border-color:var(--color-tone-900); color:var(--color-tone-900); }
.btn_rectangle.wh { border-color:var(--color-tone-300); background:transparent; color:var(--color-tone-300); }
.btn_rectangle.wh:hover { border-color:#fff; color:#fff; }
.btn_rectangle.color { background:var(--color-tone-700); border-color:var(--color-tone-700); color:#fff; }
.btn_rectangle.color:hover { background:var(--color-main); border-color:var(--color-main); }
.btn_rectangle.icon { padding:0; width:41px; }
.btn_adm { border-color:var(--color-admin); color:var(--color-admin); }
.btn_adm:hover { background:var(--color-admin); border-color:var(--color-admin); color:#fff; }
.btn_icon { display: inline-block; vertical-align: middle; text-align: center; font-size: 2em; font-weight: 600; height: 42px; line-height: 39px; background: transparent;
    transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.btn_icon.wh { color:#fff; }
.btn_sm { display: inline-block; width: auto; font-size: 13px; height: 27px; line-height: 25px; border-radius: 3px; padding: 0 0.75em; }
.btn_md { display: inline-block; width: auto; font-size: 14px; height: 30px; line-height: 28px; border-radius: 3px; padding: 0 0.75em; }

@media all and (max-width:1200px) {
	.btn_more,
	.btn_rectangle,
	.btn_icon { font-size:1em; height:37px; line-height:37px; }
	.btn_rectangle.icon, .btn_icon { width:37px; }
}
@media all and (max-width:768px) {
	.btn-box { position:relative; margin-top:1rem; }
	.btn_menu { display: inline-block; }	
}

.go-top { position:fixed; bottom:calc(3rem + 60px); right:5%; z-index:100; opacity:0; transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
.go-top.scrolled { opacity:1; }
.go-top .btn-top { display: flex; justify-content:center; align-items:center; height: 60px; width: 60px; font-size:32px;
	background:var(--color-tone-600); color: #fff; border-radius: 50%; cursor:default;
	transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
.go-top .btn-top:hover { background:var(--color-point); }
.go-top.scrolled .btn-top { cursor:pointer; }
@media all and (max-width:1200px) {
	.go-top { bottom:calc(15px + 40px + 10px); right:15px; }
	.go-top .btn-top { height:40px; width:40px; font-size:24px; }
}

.go-btns { position:fixed; bottom:2rem; right:5%; z-index:100; transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
.go-btns .btn-chat { display: flex; justify-content:center; align-items:center; height: 60px; width: 60px; font-size:32px;
	/*background:var(--color-tone-600); color: #fff;*/ background:#FFDE00; color: #231916; border-radius: 50%;
	transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
.go-btns .btn-chat img { max-width:32px; }
.go-btns .btn-chat:hover { background:#FFDE00; color: #231916; }
@media all and (max-width:1200px) {
	.go-btns { bottom:15px; right:15px; }
	.go-btns .btn-chat { height:40px; width:40px; font-size:24px; background:#FFDE00; color: #231916; }
	.go-btns .btn-chat img { max-width:24px; }
}

/* ripple btn */
.rippleBg { background-color: #a55eea5f !important; background-image: linear-gradient(120deg, #a55eea5f, #d579ff5f); }
.intro-banner-vdo-play-btn{
	height:60px; width:60px; z-index:1;
	position:absolute; left:50%; top:50%;
	margin:-30px 0 0 -30px; border-radius:100px; }
.intro-banner-vdo-play-btn .ripple{
	width:160px; height:160px; z-index:-1; opacity:0;
	position:absolute; left:50%; top:50%;
	margin:-80px 0 0 -80px; border-radius:100px;
	-webkit-animation:ripple 1.8s infinite; animation:ripple 1.8s infinite; }
@media only screen and (max-width: 1200px) {
	.intro-banner-vdo-play-btn{ height:30px; width:30px; margin:-15px 0 0 -15px; }
	.intro-banner-vdo-play-btn .ripple{ width:80px; height:80px; margin:-40px 0 0 -40px; }
}
@-webkit-keyframes ripple{
    0%{
		opacity:1;
		-webkit-transform:scale(0);
		transform:scale(0);
	}
    100%{
		opacity:0;
		-webkit-transform:scale(1);
		transform:scale(1);
    }
}
@keyframes ripple{
    0%{
		opacity:1;
		-webkit-transform:scale(0);
		transform:scale(0);
    }
    100%{
		opacity:0;
		-webkit-transform:scale(1);
		transform:scale(1);
    }
}
.intro-banner-vdo-play-btn .ripple:nth-child(2){ animation-delay:.3s; -webkit-animation-delay:.3s; }
.intro-banner-vdo-play-btn .ripple:nth-child(3){ animation-delay:.6s; -webkit-animation-delay:.6s; }

/* color mode */
.mode-dark { color:#fff; }

/* pagination */
.pagination { display:flex; justify-content:center; align-items:center; margin-top:var(--gutter-pc); }
.pagination .page_num { margin:0 4px; display:flex; justify-content:center; align-items:center; }
.pagination .btn_page,
.pagination .btn_page_num,
.pagination .text_ellipsis { display:flex; justify-content:center; align-items:center; width:32px; height:32px; border-radius:16px; margin:0 4px; 
	font-size:14px; line-height:1; background:#fff; font-weight:400; border:1px solid transparent; transition: var(--transition-slow); }
.pagination .btn_page,
.pagination .text_ellipsis { border-color:var(--color-tone-200); }
.pagination .btn_page:hover,
.pagination .btn_page_num:hover { border-color:var(--color-tone-500); }
.pagination .btn_page_num.active { background:var(--color-main); border-color:var(--color-main); color:#fff; font-weight:600; }
@media all and (max-width:1200px) {
	.pagination { margin-top:var(--mg-sec-mo); }
}
@media all and (max-width:768px) {
	.pagination .page_num { margin:0 2px; }
	.pagination .btn_page,
	.pagination .btn_page_num,
	.pagination .text_ellipsis { width:28px; height:28px; border-radius:14px; margin:0 2px; } 
}

/* form */
.form_custom { border:1px solid var(--color-tone-300) !important; background:#fff; padding:0.5rem; }
.form_custom::placeholder { color:var(--color-tone-300); }
.form_custom:required,
.form_custom:invalid { border-color: var(--color-tone-500) !important; }
input[type="checkbox"].form_custom,
input[type="radio"].form_custom { display:none; }
input[type="checkbox"].form_custom + label,
input[type="radio"].form_custom + label { cursor:pointer; }
input[type="checkbox"].form_custom + label:before,
input[type="radio"].form_custom + label:before { font-family:var(--font-icon-awe); display:inline-block; margin-right:0.25em; }
input[type="checkbox"].form_custom + label:before { content:'\f0c8'; }
input[type="radio"].form_custom + label:before { content:'\f111'; }
input[type="checkbox"].form_custom:checked + label:before,
input[type="radio"].form_custom:checked + label:before { color:var(--color-main); }
input[type="checkbox"].form_custom:checked + label:before { content:'\f14a'; }
input[type="radio"].form_custom:checked + label:before { content:'\f192'; }

.form { display: inline-block; vertical-align: middle; width: 100%; text-align: left; }
.form .f_wrap { display: inline-block; vertical-align: middle; width: 100%; padding: 5px 0; }
.form .f_field { display: inline-block; vertical-align: middle; float: left; position: relative; box-sizing: border-box; width: 100%; }
.form .f_field.div2 { float: left; position: relative; box-sizing: border-box; margin: 0 20px; width: calc(50% - 20px); }
.form .f_field.div2:first-child { margin-left: 0; }
.form .f_field.div2:last-child { margin-right: 0; }
.form .f_field .ff_title { position: absolute; left: 0; top: 0; min-height: 50px; overflow: hidden; font-weight: 500; text-align: left; }
.form .f_field .ff_title label,
.form .f_field .ff_title span { display: inline-block; vertical-align: middle; position: relative; padding: calc(1em - 5px) 3px; }
.form .f_field .ff_title.required label:after { content:" *"; color: var(--color-main); vertical-align: top; font-weight: 700; }
.form .f_field .ff_wrap { display: flex; align-items:center; margin-left: 130px !important; min-height:50px; }
/*.form .f_field .ff_wrap.option { margin: 5px 0; }*/
.form .f_field .ff_wrap.option ul { display:flex; flex-wrap:wrap; align-items:center; width: 100%; margin-bottom:-0.5em; min-height: 50px; }
.form .f_field .ff_wrap.option li { display: inline-block; vertical-align: middle; float: left; margin: 0 0.75em 0.5em 0; }
.form .f_field .ff_wrap.option input { display: none; }
.form .f_field .ff_wrap.option label { cursor: pointer; }
.form .f_field .ff_wrap.option label span { display: inline-block; vertical-align: middle; padding-right: 15px; border: 1px solid var(--color-tone-300); border-radius: 20px; background-color: #fff; line-height: 30px;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .f_field .ff_wrap.option label i { display: inline-block; vertical-align: middle; position: relative; float: left; width: 20px; height: 20px; margin: 6px;
	overflow: hidden; border-radius: 20px; background-color: var(--color-tone-100);
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .f_field .ff_wrap.option label i:before { content: ""; display: inline-block; vertical-align: middle; position: absolute; left: 0; top: 0; width: 8px; height: 4px; margin-left: 6px; margin-top: 7px;
	border-bottom: solid 2px currentColor; border-left: solid 2px currentColor; color: var(--color-tone-400); transform: rotate(-45deg); -webkit-transform: rotate(-45deg);
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .f_field .ff_wrap.option label span:hover { background-color: var(--color-main-bg); border-color: var(--color-main-bg); }
.form .f_field .ff_wrap.option input:checked + label span { background-color: var(--color-main); color:#fff; border-color: var(--color-main); }
.form .f_field .ff_wrap.option input:checked + label i:before { border-color:var(--color-main); }
.form .f_field .ff_wrap.option .text { padding: 0 5px; line-height: 30px; font-size: 14px; }
.form .f_field .ff_wrap.option .text a { font-size: 14px; }
.form .f_field .ff_wrap.text { min-height: 24px; margin: 5px 0; padding: 0 5px; font-size: 14px; line-height: 1.5; color:var(--color-tone-500); }
.form .f_field .ff_wrap.full { display:block; }
.form .f_field .ff_wrap small { font-size: 14px; line-height: 1.5; color:var(--color-tone-500); }
.form .f_field .ff_wrap strong { color:var(--color-admin); }
.form .btn_box { margin-top:1rem; text-align:center; }
.form .required, textarea.required {background:none !important;}
.form .input { display: block; vertical-align: middle; box-sizing: border-box; width: 100%; height: 50px; margin: 0; padding: 0px;
	-webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: 1px solid var(--color-tone-300); border-radius: 3px; background-color: #fff;
	line-height: 50px; text-align: left; text-indent: 15px; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .select { display: block; vertical-align: middle; position: relative; box-sizing: border-box; width: 100%; height: 50px; margin: 0; padding: 0 15px; padding-right:28px;
	-webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: 1px solid var(--color-tone-300); border-radius: 3px;
	background-color: #fff; background-image: url("../img/bu_select.png"); background-repeat: no-repeat; background-size: 13px 7px; background-position: right 8px center;
	line-height: 50px; text-align: left; var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .textarea, .form textarea{ display: block; vertical-align: middle; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 100%; min-height: 200px; resize: vertical; margin: 0; padding: 10px 15px;
	-webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: 1px solid var(--color-tone-300); border-radius: 3px; background-color: #fff;
	text-align: left; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .file { display: block; vertical-align: middle; box-sizing: border-box; width: 100%; height: 50px; margin: 5px 0; padding: 6px 0;
	-webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: 1px solid var(--color-tone-300); border-radius: 3px; background-color: #fff;
	line-height: 30px; text-align: left; padding-left: 15px; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.form .input.sm,
.form .select.sm { font-size: 14px; line-height: 28px; height: 30px; }
.form .textarea.sm, .form textarea.sm { font-size: 14px; padding-top:3px; padding-bottom:3px; min-height:80px;  }
.form .input:hover,
.form .select:hover,
.form .textarea:hover,
.form .file:hover { border-color:var(--color-tone-500) !important; }
.form .input:focus,
.form .select:focus,
.form .textarea:focus,
.form .file:focus { border-color:var(--color-main) !important; outline: none !important; box-shadow: none !important; }
@media all and (max-width:1200px) {
	.form .f_field.div2 { width:100% !important; margin: 0; }
	.form .f_field.div2:last-child { margin-top: 10px; }
	.form .f_field .ff_wrap { margin-left: 120px !important; }
	.form .f_field .ff_wrap.option label span:hover { background-color: #fff; }
	.form .f_field .ff_wrap.option .text,
	.form .f_field .ff_wrap.option .text a,
	.form .f_field .ff_wrap.text,
	.form .f_field .ff_wrap small { font-size:13px; }
	.form .f_field .ff_title label, 
	.form .f_field .ff_title span { padding:calc(1em - 1.25px) 3px; }
}
@media all and (max-width:768px) {
	.form .f_field .ff_title { position:static; height:auto; min-height:auto; line-height:1.75; }
	.form .f_field .ff_title label, 
	.form .f_field .ff_title span { padding:0; }
	.form .f_field .ff_wrap { min-height:auto; margin-left:0 !important; }
	.form .f_field .ff_wrap.text { min-height:auto; padding:0; }
	.form .f_field .ff_wrap.option ul { min-height:auto; }
	.form .input { height:40px; line-height:40px; text-indent:10px;}
	.form .select { height:40px; line-height:40px; padding: 0 10px; padding-right:23px; background-position: right 3px center; }
	.form .textarea, .form textarea { padding: 6px 10px; }
	.form .file { padding-left:10px; }
}

/* table */
.table_custom { border-top: 3px solid var(--color-main); }
.table_custom th { padding: .5rem .75rem; word-break:keep-all; }
.table_custom td { padding: .5rem .75rem; word-break:keep-all; }
.table_custom thead { background:var(--color-tone-100); }
.table_custom thead th,
.table_custom thead td { font-family:var(--font-title); text-align:center; border-bottom: 2px solid var(--color-tone-400) !important; }
.table_custom thead th { font-weight:500; }
.table_custom thead th strong { font-size: 1.25rem; font-weight: 600; }
.table_custom thead th strong i { font-size: 1.5rem; color:var(--color-admin); }
.table_custom tbody th { font-weight:500; }
.table_custom tbody th i { color:var(--color-admin); font-size: 1.2rem; vertical-align: -2px; }
.table_custom em { color:var(--color-admin); font-weight:500; font-style:normal; }
.table_custom strong { font-weight:600; }
.table_custom .caption { background-color:var(--color-main); font-weight: 600; color:#fff; text-align: center; padding-left: 0; }
.table_custom .center { text-align:center; }
.table_custom .right { text-align:right; }

.balloon{ width:240px; background:var(--color-admin); font-size:0.85rem; line-height:1.6; color:#fff; padding:0.5rem; border-radius:3px; position:absolute; display:none; word-break:keep-all; }

/* Max width before this PARTICULAR table gets nasty This query will take effect for any screen smaller than 760px and also iPads specifically. */
@media all and (max-width:1000px) {
	/* Force table to not be like tables anymore */
	.table_respon, .table_respon thead, .table_respon tbody, .table_respon tfoot, .table_respon th, .table_respon td, .table_respon tr { display: block; }
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.table_respon thead { border-bottom:none; }
	.table_respon thead tr { position: absolute; top: -9999px; left: -9999px; }
	.table_respon tr,
	.table_respon th,
	.table_respon td { border:none; }
	.table_respon th { border-bottom: 1px solid var(--color-tone-300); background:var(--color-tone-100); }
	.table_respon td { /* Behave  like a "row" */ border-bottom: 1px solid var(--color-tone-300); position: relative; padding: 6px; }
	.table_respon td:before { /* Label the data */ content: attr(data-label); /* Now like a table header */ position: absolute;
	/* Top/left values mimic padding */ top: 0; left: 0; height:100%; padding: 6px; font-family:var(--font-title); font-weight:500; }

	.apply .table_respon td { padding-left:calc(6em + 6px); }
	.price .table_respon td { padding-left:calc(11em + 6px); }
	.apply .table_respon td:before { width:6em; }
	.price .table_respon td:before { width:11em; }
	
	.table_respon .center,
	.table_respon .right { text-align:left; }
	.table_custom thead th,
	.table_custom thead td,
	.table_custom .caption { font-size:15px; padding:6px; }
	.table_custom thead th strong { font-size:15px; }
	.table_custom tbody th { font-size:14px; padding:6px; }
	.table_custom tbody td { font-size:13px; padding:6px; }
	.balloon{ width:160px; }
}

/* list */
.flex-wrap { display:flex; flex-wrap:wrap; gap:var(--gutter-pc) var(--gutter-pc); width:100%; }
.flex-wrap.col1 { flex-direction:column; }
.flex-wrap.col2 .flex-box { width: calc( (100% - 50px) / 2); }
.flex-wrap.col3 .flex-box { width: calc( (100% - 100px) / 3); }
.flex-wrap.col4 .flex-box { width: calc( (100% - 150px) / 4); }
.flex-wrap.col5 .flex-box { width: calc( (100% - 200px) / 5); }
.flex-wrap.col6 .flex-box { width: calc( (100% - 100px) / 3); }
@media all and (max-width:1600px) {
	.flex-wrap.col4 .flex-box { width: calc( (100% - 50px) / 2); }
}
@media all and (max-width:1200px) {
	.flex-wrap { gap:var(--mg-sec-mo) var(--gutter-mo); }
	.flex-wrap.col2 .flex-box { width: calc( (100% - 20px) / 2); }
	.flex-wrap.col3 .flex-box { width: calc( (100% - 40px) / 3); }
	.flex-wrap.col4 .flex-box { width: calc( (100% - 20px) / 2); }
	.flex-wrap.col5 .flex-box { width: calc( (100% - 80px) / 5); }
	.flex-wrap.col6 .flex-box { width: calc( (100% - 20px) / 2); }
}
@media all and (max-width:768px) {
	.flex-wrap.col2,
	.flex-wrap.col3 { flex-direction:column; }
	.flex-wrap.col2 .flex-box,
	.flex-wrap.col3 .flex-box { width:100%; }
	.flex-wrap.col5 .flex-box { width: calc( (100% - 20px) / 2); }
}
@media all and (max-width:560px) {
	.flex-wrap.col4,
	.flex-wrap.col6 { flex-direction:column; }	
	.flex-wrap.col4 .flex-box,
	.flex-wrap.col6 .flex-box { width:100%; }
}

.text-box { width:85%; margin:0 0 0 auto; }
@media all and (max-width:1920px) {
	.text-box { width:100%; max-width:1200px; }
}

/* round-box */
.round-box { position:relative; overflow:hidden; color:var(--color-tone-700); background: #fff;	
	/*border:1px solid rgba(255,255,255,0.25);*/ border-radius:0.5rem; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
	-webkit-backdrop-filter: blur(6px) brightness(102%); backdrop-filter: blur(6px) brightness(102%);
	transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
.round-box.padding { padding:2rem; }
.round-box .img,
.round-box .icon { max-width:auto; aspect-ratio:auto; border-radius:0; border:0 !important; background:transparent; }
/*.round-box:hover { box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1); }*/
@media all and (max-width:1200px) {
	.round-box.padding { padding:var(--gutter-mo); }
}

.list_timeline { display:flex; flex-wrap:wrap; align-items:stretch; position: relative; padding:1rem 0; padding-left:1rem; }
.list_timeline:before { content: ""; width: 13px; height: 13px; top:50%; left:0; transform:translateY(-50%); border: 2px solid var(--color-tone-500); border-radius: 50%; position: absolute; z-index:1; background:#fff; }
.list_timeline:after { content: ""; height: 100%; width: 1px; border-left: 1px dotted var(--color-tone-200); position: absolute; top:0; left: 6px; }
.list_timeline dt { font-size:1.75em; font-weight:600; padding:0 1rem; width:6rem; display:flex; align-items:center; }
.list_timeline dd { width:calc(100% - 6rem); margin:0; padding:0 1rem; display:flex; align-items:center; }
.list_timeline dd b { display:inline-block; margin-right:1em; }
.list_timeline:first-of-type:before { border-color:var(--color-main); } 
.list_timeline:first-of-type dt { color:var(--color-main); }
@media all and (max-width:560px) {
	.list_timeline dt { width:5rem; padding:0 0.5rem; }
	.list_timeline dd { width:calc(100% - 5rem); padding:0 0.5rem; }
}

.list_keyword { display:flex; flex-wrap:wrap; }
.list_keyword li { margin: 0 0.5rem 0.5rem 0; }
.list_keyword li .key { padding: 0.25em 0.75em; display: inline-block; background: #fff; border-radius: 2rem; border:1px solid var(--color-tone-200);
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.list_keyword li:hover a.key { border-color: var(--color-tone-500); }
.list_keyword li.active a.key { background-color: var(--color-main); color:#fff; border-color: var(--color-main); }

.list_dl { margin-bottom:calc(1rem - 0.25rem); }
.list_dl:after { clear:both; display: block; content: ''; line-height: 0; }
.list_dl dt { float:left; font-weight:500; margin-bottom:0.25rem; }
.list_dl dd { margin:0; margin-bottom:0.25rem; }

.list_ul li { position:relative; text-align:left; word-break:keep-all; margin-left:0.5em; }
.list_ul li:before { content:''; position:absolute; left:-0.5em; top:0.75em; width:2px; height:2px; background:var(--color-tone-700); }
.list_ul li em { color: var(--color-admin); font-style: normal; }
.list_ul.check li { margin-left:1em; }
.list_ul.check li:before { content:'\2714'; color:var(--color-tone-500); top:0; left:-1em; width:1em; height:1em; background:none; }

.list_num dt h4 { padding-bottom:1rem; position:relative; }
.list_num dt h4:before { content:attr(data-label); display: block; padding-bottom: 0.75rem; font-size: 1rem; color:var(--color-tone-700); font-weight:700; } 
.list_num dt h4:after { content: ''; position: absolute; left: 0; bottom: 0; width: 30px; height: 1px;  background:var(--color-tone-700); }

.list_icon li {display: flex; flex-direction: column; align-items: center; }
.list_icon li .img,
.list_icon li .icon { width:100%; max-width:192px; aspect-ratio:1 / 1; border-radius:50%; border:1px solid var(--color-tone-200);
	display:flex; align-items:center; justify-content:center; background:#fff; margin-bottom:1rem;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.list_icon li .icon i { font-size: 5rem; }
.list_icon li:hover .img,
.list_icon li:hover .icon { border-color:var(--color-tone-500); }
.list_icon li h4 { padding-bottom:1rem; position:relative; }
.list_icon li h4:before { content:attr(data-label); display: block; padding-bottom: 0.75rem; font-size: 1rem; color:var(--color-tone-700); font-weight:700; text-align:center; } 
.list_icon li h4:after { content: ''; position: absolute; left: 50%; bottom: 0; width: 30px; height: 1px; margin-left: -1rem; background:var(--color-tone-700); }
@media all and (max-width:768px) {
	.section.service .list_icon li .img { width:192px; }
	.section.welfare .list_icon li .icon { width:160px; font-size:3em; }
}

.list_card li a { display:block; width:100%; height:100%; border:1px solid var(--color-tone-300); border-radius:0.5em; background:#fff; padding:15px var(--gutter-mo) 75px; position:relative; transition:var(--transition-fast); }
.list_card li a:hover { border-color:var(--color-main); }
.list_card li a .tit { font-size:1.125em; font-weight:500; line-height:1.5;  margin-bottom:0.5em; }
.list_card li a .info { font-size:14px; color:var(--color-tone-600); line-height:1.4; }
.list_card li a .info dt { width:5em; float: left; padding-left: 0.5em; margin-bottom:5px; font-weight:500; }
.list_card li a .info dt:before { content: '·'; margin-left: -0.6em; padding-right: 0.2em; }
.list_card li a .info dd { padding-left:5em; margin-bottom:5px; }
.list_card li a .info:after { display: block; content: ''; clear: both; }
.list_card li a .card-bottom { display:flex; justify-content:space-between; align-items:center; position:absolute; width:calc(100% - var(--gutter-mo) - var(--gutter-mo)); height:60px; bottom:0; border-top: 1px solid var(--color-tone-300); font-size:14px; font-weight:400; }
.list_card li a .career mark { line-height:1; padding:3px 5px; margin-right:3px; color:#fff; border-radius:3px; background-image:none; }
.list_card .intern { background-color:#45aaf2; }
.list_card .junior { background-color:#4b7bec; }
.list_card .senior { background-color:var(--color-admin); }
.list_card li a .date { color:var(--color-tone-600); }
.list_card li a .date time { font-style:italic; }
.list_card li a .date .dday { color:var(--color-main); font-weight:600; letter-spacing: 0.01em; }
.list_card li a.done,
.list_card li a.done:hover { cursor:default; border-color:var(--color-tone-300); }
.list_card li a.done,
.list_card li a.done .info,
.list_card li a.done .date,
.list_card li a.done .cate { color:var(--color-tone-400); }
.list_card li a.done .career mark { background:var(--color-tone-400); }
@media all and (max-width:1200px) {
	.list_card li a { padding:15px var(--gutter-mo) 60px; }
	.list_card li a .cate,
	.list_card li a .info,
	.list_card li a .card-bottom { font-size:13px; }
	.list_card li a .card-bottom { height:50px; }
}

.list_item li .img { border:1px solid var(--color-tone-200); border-radius:0.5rem; overflow:hidden; }
.list_item li .img img { width:100%; }
.list_item li .tit { line-height:1.4; }
.list_item li .txt { font-size: 14px; line-height: 1.4; margin: 1rem 0 0; color:var(--color-tone-500);
	/*width: 100%; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;*/ }
.list_item li .desc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.list_item li .cont { font-size: 15px; line-height: 1.5; margin: 1rem 0 0; color:var(--color-tone-700); word-break: break-word; }
.list_item li h4 + .desc { margin-top:-0.5rem; }
.list_item li .list_dl { font-size:14px; line-height:1.4; margin:1rem 0 0; }
.list_item li .list_dl dt { width:2em; font-weight:600; }
.list_item li .list_dl dd { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list_item li .price { text-align:right; }
.list_item li .price em { color:#FC6180; font-weight:500; }
.list_item li .price del { color:var(--color-tone-500); }
.list_item li .price strong { font-size:1.25em; }
.list_item.rank li { position:relative; }
.list_item.rank li:before { content:attr(data-label); position: absolute; top:0; left:0; z-index: 10; display: block; background:var(--color-trans-wh);
	border-radius: 0.5rem 0 0.5rem 0; border-top:1px solid var(--color-tone-200); border-left:1px solid var(--color-tone-200);
	width: 2.5rem; height: 2.5rem; line-height: 2.5rem; text-align: center; font-family:var(--font-title); font-size: 1.5rem; font-weight: 700; color:var(--color-main); }
.list_item.rank li:nth-child(1):before { background:var(--color-main); color:#fff; }
@media all and (max-width:1200px) {
	.list_item.rank li:before { width: 2rem; height: 2rem; line-height: 2rem; font-size:1rem; }
}
@media all and (max-width:768px) {
	.list_item li h4 + .desc { margin-top:-0.75rem; }
	.list_item li .txt,
	.list_item li .list_dl { margin-top:0.5rem; }
	.list_item li .txt,
	.list_item li .list_dl { font-size:13px; }
	.list_item li .cont { font-size:14px; }
	.list_item li .list_dl dt:not(:nth-of-type(1)) { display:none; }
	.list_item li .list_dl dd:not(:nth-of-type(1)) { display:none; }
}

/* slick */
/*
.list_slick { position: relative; margin:0 -5px; }
.list_slick .slick-list { width:100%; margin: 0 auto !important; }
.list_slick .slick-slide > div { padding:5px; }
.list_slick .slick-slide div div { display:flex !important; justify-content:center; padding:0.5rem 1rem; border:1px solid var(--color-tone-200); border-radius: 0.5em; overflow:hidden; }
.list_slick .slick-slide img { }
.list_slick > .slick-arrow { top: 20px; position: absolute; display: inline-block; line-height:1; vertical-align: middle; z-index: 50;
	width: 60px; height: 60px; display:flex; align-items:center; justify-content:center; border:1px solid var(--color-tone-300); border-radius:50%; 
	text-indent: -999em; cursor: pointer; top: 50%; transform: translateY(-50%);
	transition: var(--transition-slow); -webkit-transition: var(--transition-slow); appearance:none; -moz-appearance: none; -webkit-appearance: none; }
.list_slick > .slick-prev { left: -70px; }
.list_slick > .slick-prev:before { content: '\e93b'; font-family:var(--font-icon-xei); color:#fff; font-size:1.5em; font-weight:100; text-indent:0; }
.list_slick > .slick-next {	right: -70px; }
.list_slick > .slick-next:before { content: '\e93e'; font-family:var(--font-icon-xei); color:#fff; font-size:1.5em; font-weight:100; text-indent:0; }
.list_slick > .slick-arrow:hover { background:var(--color-main); }
@media all and (max-width:1200px) {
	.list_slick { margin:0; }
	.list_slick .slick-list { width:calc(100% - 100px); }
	.list_slick .slick-slide div div { padding:0; }
	.list_slick > .slick-arrow { width:40px; height:40px; }
	.list_slick > .slick-prev { left: 0; }
	.list_slick > .slick-next {	right: 0; }
}*/
.list_slick { position: relative; margin:0 -5px; }
.list_slick .slick-list { width:100%; margin: 0 auto !important; }
.list_slick > .slick-arrow { position: absolute; z-index: 50;
	width: 40px; height: 40px; display:flex !important; align-items:center; justify-content:center; border:1px solid transparent; border-radius:50%; 
	text-indent: -999em; cursor: pointer; top: 50%; transform: translateY(-50%);
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); appearance:none; -moz-appearance: none; -webkit-appearance: none; }
.list_slick > .slick-prev { left: -20px; }
.list_slick > .slick-prev:before { content: '\e93b'; font-family:var(--font-icon-xei); color:var(--color-trans-bk); font-size:1.25rem; font-weight:100; text-indent:0;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); vertical-align: middle; }
.list_slick > .slick-next {	right: -20px; }
.list_slick > .slick-next:before { content: '\e93e'; font-family:var(--font-icon-xei); color:var(--color-trans-bk); font-size:1.25rem; font-weight:100; text-indent:0;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); vertical-align: middle; }
.list_slick > .slick-arrow:hover { border:1px solid rgba(0,0,0,0.8); }
.list_slick > .slick-arrow:hover:before { color:#000; }
.slick-dotted.slick-slider { margin-bottom:0; padding-bottom:2.25rem; }
.list_slick > .slick-dots { bottom:0; }
.list_slick > .slick-dots li button:before { color:var(--color-tone-900); }
.list_slick > .slick-dots li.slick-active button:before { color:var(--color-main); }
.list_slick .slick-slide { padding:0; text-align:center; }
.list_slick .slick-slide img { display:inline-block; }
@media all and (max-width:1200px) {
	.list_slick { margin:0; }
	.list_slick .slick-list { width:calc(100% - 100px); }
	.list_slick .slick-slide div div { padding:0; }
	.list_slick > .slick-arrow { width:40px; height:40px; }
	.list_slick > .slick-prev { left: 0; }
	.list_slick > .slick-next {	right: 0; }	
}

.step_progress { list-style: none; position: relative; width:100%; display:flex; justify-content:center; align-items:center;  align-content:center; }
.step_progress li { display:block; position: relative; padding: 0 30px; width:33.3333%; text-align: center; vertical-align: top; font-weight: 500; }
.step_progress li:before { display: block; position:relative; z-index: 1; margin: 5px auto; padding:6px 5px;
	width: 6em; background: #fff; border:1px solid var(--color-main); border-radius: 20px; 
	font-family:var(--font-title); font-weight: 700; color: var(--color-main); font-size: 10px; line-height:1; letter-spacing:0.5px; text-align: center; }
.step_progress li:after { content: ""; position: absolute; left: 0; top: 15px; right: 0; height: 1px; background: var(--color-main); }
.step_progress li:first-of-type:after { left: 50%; }
.step_progress li:last-of-type:after { right: 50%; }
.step_progress li:nth-child(1):before { content: "STEP 1"; }
.step_progress li:nth-child(2):before { content: "STEP 2"; }
.step_progress li:nth-child(3):before { content: "STEP 3"; }
.step_progress li:nth-child(4):before { content: "STEP 4"; }
@media all and (max-width:768px) {
	.step_progress li { padding: 0 10px; }
}

/* step-box */
.step-box { text-align:center; display: flex; align-items: center; justify-content:center; margin:0 -10px; }
.step-box .article { margin:0 10px; position: relative; }
.step-box.col4 .article { width:calc(25% - 20px); }
.step-box.col5 .article { width:calc(20% - 20px); }
.step-box .article + .article:before { content: '\e90b'; font-family:xeicon; position: absolute; left: 0; top:50%;
	width:48px; height: 48px; margin: -24px 0 0 -34px; background:#fff; border-radius:50%; line-height:48px; font-size:1.5rem; font-weight:100; }
.step-box .article > div { flex: 1; display: flex; flex-direction:column; align-items: center; justify-content:center;
	width:100%; aspect-ratio:1 / 1; border-radius:100%; background:#3cdbc0; }
.step-box .article strong { display: block; font-family:var(--font-title); font-size:2em; font-weight: 700; color: #fff; font-style: italic; line-height: 1; margin:0; }
.step-box .article .img { margin:10px 0; }
.step-box .article h4 { color: #fff; margin-bottom:0; }
.step-box .article p { font-size:16px; line-height: 1.5; color:#fff; font-weight:300; }
.step-box .article p b { color:#fff; }
.step-box .article:nth-child(2) > div { background: #56bccb; }
.step-box .article:nth-child(3) > div { background: #719dd5; }
.step-box .article:nth-child(4) > div { background: #8b7de0; }
.step-box .article:nth-child(5) > div { background: #a55eea; }
@media only screen and (max-width: 1600px) {
	.step-box { margin:0 -5px; }
	.step-box .article { margin:0 5px; }
	.step-box.col4 .article { width:calc(25% - 10px); }
	.step-box.col5 .article { width:calc(20% - 10px); }
	.step-box .article + .article:before { width:36px; height: 36px; line-height:34px; font-size:1.25rem; margin: -18px 0 0 -22.5px; }
	.step-box .article strong { font-size:1.25rem; }
	.step-box .article .img { margin:5px 0; }
	.step-box .article p { font-size:14px; }
}
@media only screen and (max-width: 768px) {
	.step-box { margin:-5px 0; flex-direction: column; align-items: center; }
	.step-box .article { margin:5px 0; width:140px !important; }
	.step-box .article + .article:before { content: '\e90a'; left:calc(50% + 5px); top:-5px; margin:-22.5 0 0 -18px; }
}

/* tab */
.tab-title { margin-bottom:var(--mg-sec-mo); }
.tab-title .tab-nav { cursor:pointer; }
.tab-title .tab-nav.current span { background:var(--color-main); border-color:var(--color-main); color:#fff; }
.tab-title .tab-nav.current span:before { color:#fff; }
.tab-panel { width: 100%; position: relative; }
.tab-panel .tab-cont { display:none; width: 100%; }
.tab-panel .tab-cont.current { display:block; }
@media all and (max-width:1200px) {
	.tab-title.list_keyword { margin-bottom:20px; }
}

.accordion_tabs .tab-title { flex:1; /*margin-top:-0.75rem;*/ margin-bottom:0; }
.accordion_tabs .tab-title .tab-nav { padding-top:0.75rem; padding-bottom:0.75rem; }
.accordion_tabs .tab-title .tab-nav:not(:last-child) { border-bottom:1px dotted rgba(255,255,255,0.25); }
.accordion_tabs .tab-title .tab-nav h4 { position:relative; font-size:1.25em; margin-bottom:0; }
.accordion_tabs .tab-title .tab-nav h4:after{ content: '\e913'; font-family:var(--font-icon-xei); font-size:1.25rem; position: absolute; top:50%; right:0.35rem; transform: translateY(-50%); }
.accordion_tabs .tab-title .tab-nav p { display:none; padding-top:0.5rem; }
.accordion_tabs .tab-title .tab-nav:hover h4,
.accordion_tabs .tab-title .tab-nav:hover h4:after { color:var(--color-main-a); }
.accordion_tabs .tab-title .tab-nav.current h4,
.accordion_tabs .tab-title .tab-nav.current h4:after { color:var(--color-main); }
.accordion_tabs .tab-title .tab-nav.current p { display:block; }
.accordion_tabs .tab-panel { flex:3; }
.accordion_tabs .tab-panel .text { display:none; }
@media all and (max-width:1440px) {
	.accordion_tabs .tab-title .tab-nav p,
	.accordion_tabs .tab-title .tab-nav.current p { display:none; }
	.accordion_tabs .tab-panel .text { display:block; }
}
@media all and (max-width:1200px) {
	.accordion_tabs .tab-title,
	.accordion_tabs .tab-panel { flex:none; }
	.accordion_tabs .tab-title { margin-top:0; width:100%; display:flex; flex-wrap:wrap; justify-content:center; gap:1em var(--gutter-mo); }
	.accordion_tabs .tab-title .tab-nav,
	.accordion_tabs .tab-title .tab-nav:not(:last-child) { padding-top:0; padding-bottom:0.25em; border-bottom:1px dotted rgba(255,255,255,0.25); }
	.accordion_tabs .tab-title .tab-nav h4 { font-size:1em; }
	.accordion_tabs .tab-title .tab-nav h4:after { display:none; }
	.accordion_tabs .tab-title .tab-nav:hover { border-color:var(--color-main-a); }
	.accordion_tabs .tab-title .tab-nav.current { border-bottom:1px solid var(--color-main); }
}
@media all and (max-width:520px) {
	.accordion_tabs .tab-title { justify-content:flex-start; }
}

/* board */
.board_view .list_keyword { font-family: var(--font-title); font-weight:600; margin-bottom:var(--gutter-pc); }
.board_view .main { padding:var(--mg-sec-mo) var(--gutter-pc) 1rem; }
.board_view .cont { padding:var(--mg-sec-mo) var(--gutter-pc); }
.board_view .main { background:var(--color-tone-700); }
.board_view .main h4 { color:#fff; }
.board_view .cont { border:1px solid var(--color-tone-300); }
.board_view .cont h5 { margin-bottom:1.25rem; width:100%; position:relative; }
.board_view .cont h5 strong { display: inline-block; position: relative; z-index: 1; background:#fff; padding: 0 0.5rem; line-height:1;
	border-left: 3px solid var(--color-tone-500); border-right: 3px solid var(--color-tone-500); font-weight:500; word-break:keep-all; }
.board_view .cont h5:after { content: ""; display: block; position: absolute; bottom:0.5em; width: 100%; height: 1px; border-top: 1px dashed var(--color-tone-300); }
.board_view .cont article { margin-bottom:2rem; }
.board_view .cont article:last-child { margin-bottom:0; }
.board_view .cont em { color:var(--color-main); font-weight:600; font-style:normal; }
@media all and (max-width:1200px) {
	.board_view .list_keyword { margin-bottom:var(--mg-sec-mo); }
	.board_view .main { padding:var(--mg-sec-mo) var(--gutter-mo) 1rem; }
	.board_view .cont { padding:var(--mg-sec-mo) var(--gutter-mo); }
}

/* slider */
.slider .btn_box { position:absolute; right:50%; transform:translateX(50%); height:auto; z-index:10; display: flex; align-items: center; justify-content:flex-end; }
.slider .btn_box button { display: flex; align-items: center; color:var(--color-tone-900);
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); -webkit-appearance:none; -moz-appearance:none; appearance:none; }
.slider .btn_box button:hover { color:var(--color-main); }
.slider .btn_box .swiper-pagination { position:static; width:auto; display: flex; align-items: center; justify-content:space-between; gap:0.75rem; margin:0 0.5rem; }
.slider .btn_box .swiper-pagination .swiper-pagination-bullet { background:transparent; border:1px solid var(--color-tone-900); opacity:1; border-radius:8px;
	margin:0; transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.slider .btn_box .swiper-pagination .swiper-pagination-bullet-active { background:var(--color-tone-900); width:1rem;
	transition: var(--transition-fast); -webkit-transition: var(--transition-fast); }
.slider .btn_box .swiper-pagination .swiper-pagination-bullet:hover { border-color:var(--color-main); }
.slider .btn_box .swiper-pagination .swiper-pagination-bullet-active:hover { background:var(--color-main); }
.slider .btn_box .swiper-button-next,
.slider .btn_box .swiper-button-prev { position:static; background:none; width:auto; height:auto; margin-top:0; color:var(--color-tone-900); }
.slider .btn_box .swiper-button-next:after,
.slider .btn_box .swiper-button-prev:after { display:none; }
@media all and (max-width:1200px) {
	.slider .btn_box { justify-content:center; }
}

.slider.visual { width:100%; position:relative; }
.slider.visual .swiper-slide { width:100%; height:100dvh; padding:var(--mg-sec-pc) 0; background: no-repeat 50% 50% / cover; }
.slider.visual .swiper-slide .visual_box { position:absolute; z-index:1; }
.slider.visual .swiper-slide.visual1 .visual_box { width:240px; top:50%; right:50%; transform:translateY(-50%); }
.slider.visual .swiper-slide.visual2 .visual_box { width:50%; top:50%; right:50%; transform:translateY(-50%); }
.slider.visual .swiper-slide.visual3 .visual_box { width:50%; top:50%; right:50%; transform:translateY(-50%); }
.slider.visual .swiper-slide .inner { padding-top:0; padding-bottom:0; height:100%; position:relative; }
.slider.visual .swiper-slide .text_box { position:absolute; top:50%; right:var(--gutter-pc); transform:translateY(-50%);
	border:1px solid rgba(255,255,255,0.25); border-radius:0.5em; box-shadow: 0 0 20px 0 rgba(0,0,0,0.05);
	width:calc(50% - var(--gutter-pc) ); padding:var(--gutter-pc); z-index:2;
	-webkit-backdrop-filter: blur(5px) brightness(102%); backdrop-filter: blur(5px) brightness(102%); }
.slider.visual .swiper-slide span { display:inline-block; margin-bottom:1rem; font-family:var(--font-title); font-size:1.125em; letter-spacing: 0.01em; }
.slider.visual .swiper-slide b,
.slider.visual .swiper-slide strong { font-weight:700; }
.slider.visual .swiper-slide .tit { margin-bottom:1rem; font-size:3em !important; line-height:1.3; font-weight:800 !important; letter-spacing:-0.025em; }
.slider.visual .swiper-slide .txt { margin-bottom:3rem; word-break:keep-all; }
.slider.visual .btn_box { bottom:var(--mg-sec-md); }
.slider.main { padding-bottom:0 !important; }
.slider.main .swiper-container { position:relative; padding-bottom: var(--mg-sec-md); }
.slider.main .swiper-container .swiper-link { display:block; transform: scale(0.975); transition: all .15s ease-in-out; }
.slider.main .swiper-container .swiper-link:hover { transform: scale(1); }
.slider.main .swiper-wrapper > li .swiper-link:after { content:''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:rgba(255,255,255,0.5); transition:all .15s ease-in-out; opacity: 1; }
.slider.main .swiper-wrapper > li.swiper-slide-active .swiper-link:after,
.slider.main .swiper-wrapper > li.swiper-slide-next .swiper-link:after,
.slider.main .swiper-wrapper > li.swiper-slide-prev .swiper-link:after,
.slider.main .swiper-wrapper > li.swiper-slide-duplicate-active .swiper-link:after,
.slider.main .swiper-wrapper > li.swiper-slide-duplicate-next .swiper-link:after,
.slider.main .swiper-wrapper > li.swiper-slide-duplicate-prev .swiper-link:after {opacity: 0;}
.slider.main .swiper-control { position: absolute; top:42.5%; margin-top:-.9em; width: 100%; display:flex; justify-content: space-between; }
.slider.main .swiper-control .swiper-button-prev,
.slider.main .swiper-control .swiper-button-next { display:flex; justify-content:center; align-items:center; outline:none; color:var(--color-tone-900);
	width:1.8em; height:1.8em; background:rgba(255,255,255,0.75); border-radius:2em; font-size:2em; transition: all .15s ease-in-out; }
.slider.main .swiper-control .swiper-button-prev:after,
.slider.main .swiper-control .swiper-button-next:after { display:none; }
.slider.main .swiper-control .swiper-button-prev:hover,
.slider.main .swiper-control .swiper-button-next:hover,
.slider.main .swiper-control .swiper-button-prev:focus,
.slider.main .swiper-control .swiper-button-next:focus { color:var(--color-main); outline:none; } 
.slider.main .btn_box { bottom:var(--mg-sec-mo); }
@media all and (max-width:1200px) {
	.slider.visual .swiper-slide .tit { font-size:2.5em !important; }
}
@media all and (max-height:850px) {
	.slider.visual .swiper-slide { padding:var(--mg-sec-md) 0; }
	.slider.visual .swiper-slide .text_box { padding:var(--gutter-mo); }
	.slider.visual .swiper-slide .tit { font-size:2.5em !important; }
	.slider.visual .swiper-slide .txt { margin-bottom:1rem; }
}
@media all and (max-width:768px) {
	.slider.visual .swiper-slide { padding:var(--mg-sec-md) 0; }
	.slider.visual .swiper-slide.visual1 { background: no-repeat 32.5% center / cover; }
	.slider.visual .swiper-slide.visual1 .visual_box { top:auto; bottom:15%; left:50%; transform:translateX(-50%); }
	.slider.visual .swiper-slide.visual2 { background: no-repeat center center / cover; }
	.slider.visual .swiper-slide.visual2 .visual_box { width:100%; max-width:560px; top:auto; bottom:10%; left:50%; transform:translateX(-50%); }
	.slider.visual .swiper-slide.visual3 { background: no-repeat center center / cover; }
	.slider.visual .swiper-slide.visual3 .visual_box { width:100%; max-width:560px; top:auto; bottom:10%; left:50%; transform:translateX(-50%); }
	.slider.visual .swiper-slide .inner { display:block; }
	.slider.visual .swiper-slide .text_box { text-align:center; width:calc(100% - var(--gutter-mo) - var(--gutter-mo) ); padding:var(--gutter-mo);
		top:0; right:50%; transform:translateX(50%); }	
	.slider.visual .btn_box { bottom:var(--mg-sec-mo); }
}
@media all and (max-width:560px) {
	.slider.main .swiper-container { padding-left:var(--gutter-mo); padding-right:var(--gutter-mo); }
	.slider.main .swiper-control { margin-left:-20px; }
	.slider.main .swiper-container .swiper-link { transform: scale(1); }
}

/* Modal */
.modal.fade h5,
.modal.fade h6 { font-family:var(--font-title); }
.modal.fade .modal-header .modal-title ~ .modal-close { margin-left:auto; }
.modal.fade .modal-body { font-size:0.9em; }
.modal.fade .modal-body::-webkit-scrollbar { width: 8px;  /* 스크롤바의 너비 */ }
.modal.fade .modal-body::-webkit-scrollbar-thumb { height: 30%; /* 스크롤바의 길이 */ background: var(--color-tone-600); /* 스크롤바의 색상 */ border-radius: 10px; }
.modal.fade .modal-body::-webkit-scrollbar-track { background: var(--color-tone-200); /*스크롤바 뒷 배경 색상*/ }
.modal.fade .modal-body h6 { margin:1.5rem 0 .5rem; }
.modal.fade .modal-body ol,
.modal.fade .modal-body ol li { list-style-type: decimal; list-style-position: inside; }
.modal.fade .modal-body ul,
.modal.fade .modal-body ul li { list-style-type: circle; list-style-position: inside; }
.modal.fade .modal-body ol > li > ul { margin-left:1rem; }
.modal.fade .modal-body ul > li > ol { margin-left:1rem; }

/* === Layout === */

#header { width:100%; min-width:320px; position:fixed; top:0; right:0; left:0; z-index:1000; border-bottom:1px solid rgba(255,255,255,0.5);
	transition: var(--transition-slow); -webkit-transition: var(--transition-slow);
	-webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
#header.sub-header {background:rgba(255,255,255,0.75); box-shadow: 0 0 20px 0 rgba(0,0,0,0.05); }
#header.scrolled { background:rgba(255,255,255,0.75); border-color:var(--color-tone-300); box-shadow: 0 0 20px 0 rgba(0,0,0,0.05); }
#header.scrolled:has(.top_wide_banner) {top:-90px;}
#header .inner { display:flex; align-items:center; }
#header #logo { width:132px; width:200px; height:var(--mg-sec-md); padding:0; }
#header #logo a { display:flex; align-items:center; height:var(--mg-sec-md); }
#header #logo a img { max-height:48px; }

#header .top_wide_banner {background:url('/img/landing/top_banner_bg.jpg') no-repeat 50%;background-size:cover;width:100%;overflow:hidden;display:block;}
#header .top_wide_banner .inner {display:flex;align-items:center;justify-content:center;gap:160px;position:relative;}
#header .top_wide_banner img {height:100%;max-height:90px;width:auto;align-self:flex-end;}
#header .top_wide_banner p {font-size:13px;color:#fff;line-height:1.1;}
#header .top_wide_banner p small {display:block;font-weight:300;line-height:1.3;}
#header .top_wide_banner p .bn_txt {font-size:24px;font-weight:600;font-family: 'MaplestoryOTFBold';text-shadow:0 0 4px rgba(0, 0, 0, .1);}
#header .top_wide_banner p .b_num {font-size:1.9em;color:var(--color-red-7);font-family: 'KOTRAHOPE';line-height: 1;vertical-align: sub;}
#header .top_wide_banner .btn_box {position:absolute;bottom:5px;right:var(--gutter-pc);font-size:12px;color:#fff;}
#header .top_wide_banner .btn_box button {color:var(--color-blue-1);font-weight:300;}


/*
#header #logo a img.bk { display:none; }
#header #logo a img.wh { display:block; }
#header.scrolled #logo a img.bk { display:block; }
#header.scrolled #logo a img.wh { display:none; }
*/
#header .bg-menu { position: absolute; left: 0; right:0; top:var(--mg-sec-md); height:150px; background:rgba(33,33,33,0.9);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display:none; }

@media all and (max-width:1200px) {
	#header .top_wide_banner .inner {justify-content:space-around;gap:0;}
	#header .top_wide_banner .btn_box {right:var(--gutter-mo);}
}
@media all and (max-width:768px) {
	#header.scrolled:has(.top_wide_banner) {top:0px;}
	#header #logo,
	#header #logo a { height: var(--gutter-pc); }
	#header #logo a img { max-height:32px; }
	#header .top_wide_banner .inner {justify-content:flex-start;gap:10px;}
	#header .top_wide_banner img {max-width:calc(100% - 300px);}
	#header .top_wide_banner p {padding:10px 0;}
	#header .top_wide_banner p .bn_txt {font-size:16px;}
}
@media all and (max-width:580px) {
	#header .top_wide_banner .inner {min-height:65px;}
	#header .top_wide_banner p small,
	#header .top_wide_banner img {display:none;}
	#header .top_wide_banner .btn_box {right:12px;bottom:0;}
	#header .top_wide_banner .btn_box button {font-size:12px;}
}

.nav-gnb { flex:1; background:transparent; }
#gnb .depth1 { display:flex; justify-content:flex-end; gap:var(--gutter-pc); }
#gnb .depth1:after { display:none; }
#gnb .depth1 > li { display:flex; align-items:center; height:var(--mg-sec-md); }
#gnb .depth1 > li .btn-dep1 { display:block;height:var(--mg-sec-md);line-height:68px; font-family:var(--font-title); font-weight:500; text-transform:uppercase; border-bottom:5px solid transparent; }
#gnb .depth1 > li .btn-dep1:hover { border-color:var(--color-trans-bk); }
#gnb .depth1 > li .btn-dep1.on { border-color:var(--color-main); color:var(--color-tone-900); }
#gnb .depth1 > li .btn-member { display:flex; align-items:center; height:var(--mg-sec-md); font-family:var(--font-title); font-weight:500; border-bottom:5px solid transparent; }
#gnb .depth1 > li .btn_rectangle.color { background:var(--color-sub); border-color:var(--color-sub); color:#fff; }
#gnb .depth1 > li .btn_rectangle.color:hover { background:var(--color-main); border-color:var(--color-main); }
@media all and (max-width:1200px) {
	#gnb .depth1 { gap:calc( var(--gutter-mo) + 0.5rem); }
}
@media all and (max-width:768px) {
	.nav-gnb { width:200px; height:100dvh; position:fixed !important; top:0; right:-200px; z-index:99; padding:var(--mg-sec-md) var(--mg-sec-mo) var(--gutter-mo);
		background:rgba(33,33,33,0.9); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: var(--transition-slow); -webkit-transition: var(--transition-slow); }
	.nav-gnb.opened { right:0; }
	#gnb .depth1 { flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:1rem; }
	#gnb .depth1 > li { width:100%; flex-direction:column; align-items:flex-start; height:auto; }
	#gnb .depth1 > li .btn-member { display:inline-block; height:1.75em; font-size:1.25em; font-weight:400; border-bottom:3px solid transparent; color:#fff; }
	#gnb .depth1 > li .btn-dep1 { display:inline-block; height:1.75em; font-size:1.25em; border-bottom:3px solid transparent; color:#fff; }
	#gnb .depth1 > li .btn-dep1:hover { border-color:transparent; }
	#gnb .depth1 > li .btn-dep1.on { border-color:#fff; color:#fff; }
	#gnb .depth2 { width:100%; margin-top:0.5rem; display:flex; flex-wrap:wrap; gap:0.25rem 0; }
	#gnb .depth2 > li { flex:1 1 100%; }
	#gnb .depth2 > li .btn-dep2 { font-family:var(--font-title); font-size:1em; color:var(--color-tone-500); }
	#gnb .depth2 > li .btn-dep2:hover { border-color:transparent; }
	#gnb .depth2 > li .btn-dep2.on { color:#fff; }
	#gnb .depth1 > li .btn-dep1 {line-height:1;}	
}

#gnb.nav-landing .depth1 > li .btn-dep1 { font-weight:500; font-size:18px; }
@media only screen and (max-width: 1400px) {
	#gnb.nav-landing .depth1 { gap: var(--gutter-mo); }
	#gnb.nav-landing .depth1 > li .btn-dep1 { font-size:16px; }
}
@media only screen and (max-width: 768px) {
	#gnb.nav-landing .depth1 > li .btn-dep1 { font-size:18px; letter-spacing:0; }
}

.nav-lnb ul { display: flex; flex-wrap:wrap; justify-content: center; padding-top:var(--mg-sec-md); }
.nav-lnb li a.key { font-family: var(--font-title); font-weight:500; letter-spacing: 0.01em; /*text-transform: uppercase;*/ background:transparent; border-color:transparent; }
.nav-lnb li a.key:before { content:'#'; }
.nav-lnb li:hover a.key { border-color:rgba(255,255,255,0.5); }
.nav-snb { background:var(--color-main-bg); height: 50px; position: relative; }
.nav-snb > ul { display:flex; justify-content:center; }
.nav-snb > ul > li { border-right:1px solid var(--color-trans-wh); height: 50px; position: relative; }
.nav-snb > ul > li:first-child { border-left:1px solid var(--color-trans-wh); }
.nav-snb > ul > li:hover .btn-dep1{ background:var(--color-main); }
.nav-snb > ul > li.active .btn-dep1{ background: #fff; color: var(--color-main); }
.nav-snb .btn-dep1 { display: block; padding:0 2em; line-height: 50px; font-family:var(--font-title); font-size:1.125em; font-weight:500; color: #fff; }
@media all and (max-width:768px) {
	.nav-lnb ul { padding-top:var(--mg-sec-mo); }
	.nav-snb .btn-dep1 { padding:0 1em; }
}

#contents { /*overflow:hidden;*/ width:100%; }
#contents .section { padding:100px 0; position:relative; }
.section h1, .section h2,
.section h3, .section h4,
.section h5, .section h6 { font-family:var(--font-title); word-break:keep-all; position: relative; }
.section h2 { display:inline-block; font-size: 1.125em; font-weight:700; letter-spacing: 0.01em; text-transform:uppercase; margin-bottom:1rem; }
.section h2::after { content: ''; position:absolute; top:70%; right:calc(100% + 0.5rem); display:block; width:2000px; height:1px; background:var(--color-tone-700); }
.section h3 { font-size:2.5em; font-weight:800; line-height:1.3; letter-spacing:-0.025em; }
.section h4 { font-size:1.5em; font-weight:500; letter-spacing:-0.01em; margin-bottom:1rem; }
.section h5 { font-size:1.25em; letter-spacing:-0.01em; margin-bottom:1rem; }
.section h6 { font-size:1.125em; }
.section hgroup { margin-bottom:var(--mg-sec-md); position:relative; }
.section p,
.section dt, .section dd,
.section li { word-break:keep-all; }
.section mark { background-image: linear-gradient(120deg, var(--color-main-b) 0%, var(--color-main-b) 100%);
	background-repeat: no-repeat; background-size: 100% 30%; background-position: 0 90%; padding:0 0.1em; }
.section .saying { display:inline-block; position: relative; padding-right: 2.5rem; }
.section .saying q { font-family: var(--font-title); font-size: 2.5em; font-weight: 800; line-height: 1.3; letter-spacing: -0.04em; word-break: keep-all; }
/*.section .saying:before { content: "“"; }*/
.section .saying:after { content: "”"; color:#fff; position:absolute; top:-2.5rem; right:0; font-size:6rem; }
.section .saying cite { margin-left:1rem; word-break: keep-all; }
.section .saying cite:before { content: "― "; }
.section .desc { margin-bottom:1rem; font-size:1.125em; }
.section .cate { font-size:14px; font-weight:500; font-family:var(--font-title); text-transform: uppercase; margin-bottom:0.25rem; color: var(--color-main); }
.section .img { margin-bottom:1rem; }
.section .img.line { position:relative; }
.section .img.line::before { content: ''; position:absolute; top:50%; left:-200%; right:-200%; display:block; width:400%; height:1px; border-top: 2px dotted var(--color-tone-200); z-index:-1; }
.section .img.circle { margin-bottom:1em; }
.section .img.circle img { overflow:hidden; border-radius:50%; }
.section .img.respon { position:relative; padding-bottom:1rem; }
.section .img .pc { aspect-ratio:960 / 540; object-fit:cover; object-position: center top; overflow:hidden; background:#fff; width:calc(100% - 1rem); }
.section .img .mo { aspect-ratio:283 / 613; object-fit:cover; object-position: center top; overflow:hidden; background:#fff; width:20%; position:absolute; bottom:0; right:0; box-shadow: 0 0.5em 1.5em rgba(0,0,0,0.15); }
.section .map { position: relative; overflow: hidden; min-height:480px; border: 1px solid var(--color-tone-300);}
.section .txt_adm,
.section .txt_adm a { color:var(--color-admin); } 
.section .btn_box { margin-top:var(--mg-sec-md); display:flex; justify-content:center; gap:4px; }
@media all and (max-width:1200px) {
	.section hgroup { margin-bottom:var(--mg-sec-mo); }
	.section h3 { font-size:2em; }
	.section h4 { font-size:1.25em; }
	.section h5 { font-size:1.125em; }
	.section h6 { font-size:1em; }
	.section .saying q { font-size:2em; }
	.section .cate { font-size:13px; }
	.section .desc { font-size:1em; }
	.section .img.respon { width:100%;}
	.section .btn_box { margin-top:var(--mg-sec-mo); }
}
@media all and (max-width:768px) {
	.section hgroup { overflow:hidden; }
	.section h2::after { content: ''; position:absolute; top:70%; left:calc(100% + 0.5rem); display:block; width:2000px; height:1px; background:var(--color-tone-700); }
	.section .saying q,
	.section .saying cite { display:block; }
	.section .saying cite { margin:0.5rem 0 0 0; }
}
.section .count { margin-top:var(--mg-sec-md); }
.section .count ul { display:flex; justify-content:center; align-items:center; }
.section .count ul li { flex:none; min-width:240px; vertical-align:top; text-align:center; }
.section .count ul li + li { padding-left:1.5rem; margin-left:1.5rem; border-left:1px solid var(--color-tone-300); }
.section .count ul li div { font-size:3em; line-height: 1; font-weight: 600; font-family: var(--font-title);}
.section .count ul li div .num { color:var(--color-main); }
.section .count p { font-size:1.5em; padding-top:0.5rem; }
@media only screen and (max-width: 1200px) {
	.section .count { margin-top:var(--mg-sec-mo); }
	.section .count ul li { min-width:auto; }
	.section .count ul li + li { padding-left:0.75rem; margin-left:0.75rem; }
	.section .count ul li div { font-size:1.5em; }
	.section .count p { font-size:1em; padding-top:0.25rem; }
}

.section.landing .img,
.section.landing .img_box { text-align:center; }
.section.landing .txt_gothic { font-family:var(--font-gothic); font-weight:500; letter-spacing:-0.025em; }
.section.landing .txt_hand { font-family:var(--font-hand); font-weight:800; letter-spacing:-0.025em; line-height: 1.3; }
.section.landing h3.txt_gothic { font-size:4em; }
@media only screen and (max-width: 1200px) {
	#contents .section.landing { padding:70px 0; }
	.section.landing h3.txt_gothic { font-size:3em; }
}

.section.landing.visual { width:100%; overflow:hidden;
	background: url('../img/landing/bg_visual.png') no-repeat 100% 50%; background-size:contain; padding-top:150px !important; }
.section.landing.visual .main { display:flex; align-items:center; justify-content:space-between; }
.section.landing.visual .main img { width:45%; height:auto; max-width:600px; max-height:600px; aspect-ratio: 1 / 1; }
.section.landing.visual .main .tit { font-family:var(--font-title); font-size:5em; font-weight:400; letter-spacing:-0.05em; margin-bottom:1rem; }
.section.landing.visual .main .tit em { font-weight:800; color:var(--color-main); letter-spacing:-0.06em; }
.section.landing.visual .main .txt { font-family:var(--font-title); font-size:1.75em; }
.section.landing.visual .inner_main { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.section.landing.visual .inner_main > .list_slick { width:calc(50% - 10px); }
.section.landing.visual .inner_main > .text_box { width:calc(50% - 10px); }
.section.landing.visual .inner_main .text_box .tit { font-family:var(--font-title); font-size:4em; font-weight:400; letter-spacing:-0.05em; margin-bottom:1rem; width:auto; }
.section.landing.visual .inner_main .text_box .tit em { font-weight:800; color:var(--color-main); letter-spacing:-0.06em; }
.section.landing.visual .inner_main .text_box .txt { font-family:var(--font-title); font-size:1.5em; }
.section.landing.visual .list_slick .slick-slide img { width:100%; max-width:640px; aspect-ratio:1/1; }
.section.landing.visual .scroll { position: absolute; left: 50%; bottom:50px; width:2rem; height:2rem; margin-left:-1rem; z-index:4; 
	-webkit-animation: mover 1s infinite alternate; animation: mover 1s infinite alternate; }
.section.landing.visual .scroll .btn_icon { width:2rem; height:2rem; color:var(--color-trans-bk); font-size:2rem; padding:0; }
.section.landing.visual .scroll .btn_icon:hover { color:#000; }
.section.landing.visual .back_vid { object-fit: cover; width: 100vw; height: 100dvh; position: absolute; top: 0; left: 0; z-index:1; }
@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
.section.landing.intro { background:var(--color-tone-100); }
.section.landing.intro .flex-wrap.col1 { gap:0; }
.section.landing.intro .grid-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 100px var(--gutter-pc); align-items: center; }
.section.landing.intro .img_box { grid-column: 1/2; }
.section.landing.intro .text_box { grid-column: 2/4; }
.section.landing.intro .text_box .txt { font-family:var(--font-title); font-size:3.5em; line-height: 1.4; letter-spacing:-0.05em; }
.section.landing.intro .text_box .txt em { color:var(--color-main); font-weight:600; font-style:normal; }
.section.landing.intro .reverse .text_box { grid-column: 1/3; grid-row:1; }
.section.landing.intro .reverse .img_box { grid-column: 3/4; grid-row:1; }
.section.landing.intro .reverse .text_box .txt { text-align:right; }
@media only screen and (max-width: 1600px) {
	.section.landing.visual .main .tit { font-size:3.5em; }
	.section.landing.visual .inner_main .text_box .tit { font-size:3.25em; }
	.section.landing.visual .main .txt { font-size:1.5em; }
	.section.landing.visual .inner_main .text_box .txt { font-size:1.25em; }
	.section.landing.intro .text_box .txt { font-size:2.5em; }
}
@media only screen and (max-width: 1200px) {
    .section.landing.visual { min-height:400px; padding-top: 160px !important; }	
	.section.landing.visual .inner_main .text_box .tit { font-size:3em; }
	.section.landing.visual .inner_main .text_box .txt { font-size:1.125em; }
	.section.landing.visual .inner_main .btn-box.bottom { margin-top:var(--mg-sec-mo); }
	.section.landing.visual .scroll { bottom:1rem; margin-left:-1rem; }
	.section.landing.visual .scroll .btn_icon { font-size:2rem; }
	.section.landing.intro .grid-wrap { display:flex; flex-direction:column; gap:0; }
	.section.landing.intro .text_box .txt { text-align:center !important; }
	.section.landing.intro .img_box img { width:100%; max-width:320px; }
	.section.landing.price .tab-title { position:sticky; top:70px; z-index:1; margin: -0.5rem -0.5rem 20px; margin-right:-0.5rem; padding:0.5rem 0.5rem 0; background-color:var(--color-tone-100); }
}
@media only screen and (max-width: 768px) {
	.section.landing.visual { background: url('../img/landing/bg_visual_mo.png') no-repeat 50% 100%; background-size:contain; padding-top: 160px !important; }
	.section.landing.visual .main,
	.section.landing.visual .inner_main { flex-direction:column; gap:20px; }
	.section.landing.visual .main img { width:80%; max-width:640px; max-height:640px; }
	.section.landing.visual .main .tit { font-size:3em; text-align:center; }
	.section.landing.visual .inner_main .text_box .tit { font-size:2.5em; text-align:center; }
	.section.landing.visual .main .txt { font-size:1.125em; text-align:center; }
	.section.landing.visual .inner_main .text_box .txt { font-size:1em; text-align:center; }
	.section.landing.visual .inner_main .btn-box { justify-content:center; }
	.section.landing.visual .inner_main > .text_box { width:100%; }
	.section.landing.visual .inner_main > .list_slick { width:100%; }	
	.section.landing.visual .list_slick .slick-slide img { max-width:480px; }
	.section.landing.intro .text_box .txt { font-size:1.75em; }
	.section.landing.price .tab-title { top:var(--gutter-pc); }
}

.section.landing.point .inner { display:flex; flex-wrap:wrap; display:flex; flex-wrap:wrap; gap:100px var(--gutter-pc); }
.section.landing.point .inner > .flex-wrap { align-items:flex-start; }
.section.landing.point .inner > .flex-wrap:nth-child(odd) { flex-direction:row-reverse; }
.section.landing.point h2 { display:block; }
.section.landing.point h2::after { width:calc(100% - 5em); top:0.25em; right:0; }
.section.landing.point .img.flex-box { margin-bottom:0; }
.section.landing.point .list_ul.check li { font-family:var(--font-title); font-size:1.5em; font-weight:500; letter-spacing:-0.01em; }
.section.landing.point .list_ul.check li:before { color:var(--color-main); }
.section.landing.point .swiper-pagination-bullet-active { background-color:var(--color-main); }
@media only screen and (max-width: 1200px) {
	.section.landing.point .list_ul.check li { font-size:1.25em; }
}
@media only screen and (max-width: 768px) {
	.section.landing.point h2 { display:inline-block; }
	.section.landing.point h2::after { content: ''; position: absolute; top: 70%; left: calc(100% + 0.5rem); display: block; width: 2000px; height: 1px; background: var(--color-tone-700); }
}


/* price */
.price-wrap { margin-bottom:var(--mg-sec-md); }
.price-box { display:flex; flex-direction:column; }
.price-box h4 { font-size:1.5rem; font-weight:600; margin-bottom:0.25rem; }
.price-box h6 { font-weight:500; }
.price-box .desc { color:var(--color-tone-600); font-size:1em; margin-bottom:1rem; }
.price-box .price { margin-bottom:0; }
.price-box .price span { color:var(--color-tone-600); }
.price-box .price strong { font-family:var(--font-title); font-weight:700; font-size:2rem; letter-spacing: -0.01em; }
.price-box .price small { color:var(--color-tone-500); font-size:0.75rem; }
.price-box .list_ul { /*min-height:9rem;*/ margin:1rem 0; border-top:1px solid var(--color-tone-300); border-bottom:1px solid var(--color-tone-300); padding:1rem 0; }
.price-box .list_ul.check { margin:0 0 1rem; border:none; }
.price-box .list_icon { display:flex; flex-wrap:wrap; justify-content:center; gap: var(--gutter-mo) var(--gutter-mo); min-height:23rem; margin:1rem 0 2rem; padding:0; }
.price-box .list_icon.column { flex-direction:column; justify-content:flex-start; }
.price-box .list_icon li { font-size:14px; padding:0.5rem; border-radius:0.5rem; }
.price-box .list_icon.col6 li { width: calc( (100% - 40px) / 3); }
.price-box .list_icon.none li { width:100%; display:flex; justify-content:center; align-items:center; font-size:1.125rem; }
.price-box .list_icon li .icon { margin-bottom:0.5rem; font-size:2rem; }
.price-box .btn-box { position:static; display:flex; gap: var(--gutter-mo); margin-top:auto; }
.price-box .btn-box div { flex:1; }
.price-box .btn-box a { width:100%; height:auto; line-height:1.5; padding-top:0.5em; padding-bottom:0.5em; /*margin-bottom:0.5rem;*/ }
.price-box.plan1:hover { border-color: var(--color-green-3); }
.price-box.plan1 h4,
.price-box.plan1 em,
.price-box.plan1 .list_ul.check li:before { color:var(--color-green-5); }
.price-box.plan1 .btn_rectangle.color:hover { border-color:var(--color-green-5); background:var(--color-green-5); }
.price-box.plan2:hover { border-color: var(--color-blue-3); }
.price-box.plan2 h4,
.price-box.plan2 em,
.price-box.plan2 .list_ul.check li:before { color:var(--color-blue-5); }
.price-box.plan2 .btn_rectangle.color:hover { border-color:var(--color-blue-5); background:var(--color-blue-5); }
.price-box.plan3:hover { border-color: var(--color-violet-3); }
.price-box.plan3 h4,
.price-box.plan3 em,
.price-box.plan3 .list_ul.check li:before { color:var(--color-violet-5); }
.price-box.plan3 .btn_rectangle.color:hover { border-color:var(--color-violet-5); background:var(--color-violet-5); }
.price-box.plan4:hover { border-color: var(--color-pink-3); }
.price-box.plan4 h4,
.price-box.plan4 em,
.price-box.plan4 .list_ul.check li:before { color:var(--color-pink-5); }
.price-box.plan4 .btn_rectangle:hover { border-color:var(--color-pink-5); color:var(--color-pink-5); }
.price-box.plan4 .price strong { color:var(--color-tone-500); }
.price-box .list_icon .gray { color:var(--color-tone-500) !important; background:#fff !important; }
.price-box .list_icon .gray .icon { color:var(--color-tone-500) !important; }
@media all and (max-width:1600px) {
	.price-box .list_icon.col6 li { width: calc( (100% - 20px) / 2); }
	.price-box .btn-box { flex-direction:column; }
}
@media all and (max-width:1200px) {
	.price-wrap { margin-bottom:var(--mg-sec-mo); }
	.price-box .list_icon.col6 li { width: calc( (100% - 40px) / 3); }
	.price-box .btn-box { flex-direction:row; }
	.price-box .list_ul,
	.price-box .btn-box { min-height:auto; }
	.price-box .btn-box a { font-size:1.125em; }
	.price-box .list_icon { min-height:4rem; }
}

/* faq */
.list_faq { flex-direction:column; gap:var(--gutter-mo) var(--gutter-mo); margin:0 auto; }
.faq-box { background:#fff; border-radius:1rem; overflow:hidden; border:0; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.025); padding:2rem; height:auto; }
.faq-box .faq_q { display:flex; align-items:flex-start; flex-direction:row-reverse; flex-wrap:wrap; position:relative; cursor:pointer; }
.faq-box .faq_q:before { content:'Q.'; font-family:var(--font-title); font-size:1.25em; font-weight:500; line-height: 1.3;
	position:absolute; top:0; left:0; display:inline-block; flex:none; z-index:1; }
.faq-box .faq_q h5 { margin-bottom:0; padding:0 0.5rem; padding-left:2rem; line-height: 1.4; width:calc(100% - 24px); }
.faq-box .faq_q .button { margin-left: auto; flex:none; position: relative; width:24px; height:24px; padding:0; border:0 none; }
.faq-box .faq_q .button:before,
.faq-box .faq_q .button:after{ content: ""; position: absolute; background-color: var(--color-tone-900); transition: transform .25s ease-out; }
.faq-box .faq_q .button:before{ /* Vertical line */ top: 0; left: 50%; width: 2px; height: 100%; margin-left: -1px; }
.faq-box .faq_q .button:after{ /* horizontal line */ top: 50%; left: 0; width: 100%; height: 2px; margin-top: -1px; }
.faq-box .faq_a { margin-top:1rem; position:relative; }
.faq-box .faq_a:before { content:'A.'; font-family:var(--font-title); font-size:1.25em; font-weight:500; line-height: 1.5;
	position:absolute; top:0; left:0; display:inline-block; flex:none; }
.faq-box .faq_a p { padding:0 0.5rem; padding-left:2rem; font-size:1.125em; margin-bottom:0; }
/*
.faq-box.active { background:var(--color-main); color:#fff; }
.faq-box.active .faq_q .button:before{ transform: rotate(90deg); background-color:#fff; }
.faq-box.active .faq_q .button:after{ transform: rotate(180deg); background-color:#fff; }
*/
@media all and (max-width:1200px) {
	.faq-box { padding:var(--gutter-mo); }
	.faq-box .faq_q h5 { width:calc(100% - 18px); }
	.faq-box .faq_q .button { width:18px; height:18px; }
	.faq-box .faq_q:before,
	.faq-box .faq_a:before { font-size:1.125em; }
	.faq-box .faq_a p { font-size:1em; }
}
/* 부트스트랩 */
.faq-box.accordion-item { border-radius:1rem !important; border:none !important; }
.accordion-button:focus { background:transparent !important; box-shadow:none !important; }
.accordion-button:not(.collapsed) { background:transparent !important; box-shadow:none !important; }
.accordion-button:not(.collapsed):before { transform: rotate(90deg); background-color:var(--color-main); }
.accordion-button:not(.collapsed):after { transform: rotate(180deg); background-color:var(--color-main); }
.accordion-button:not(.collapsed) ~ h5 { color:var(--color-main); }



#footer { width:100%; background:var(--color-tone-900); color:var(--color-tone-500); padding:var(--mg-sec-mo) 0; font-size:14px; word-break:keep-all; }
#footer a { color:var(--color-tone-300); }
#footer a:hover { color:#fff; }
#footer .inner { display:flex; gap:var(--gutter-pc); }
#footer .foot { flex:auto; position:relative; }
#footer .logo a { display:flex; align-items:center; height:48px; }
#footer .logo a img { max-height:48px; }
#footer .addr dt { width:6em; float:left; }
#footer .addr dd { padding-left:6em; margin:0; }
#footer .addr address { display:inline; }
#footer .copyright { margin-top:0.5rem; }
#footer #fnb { margin-bottom:0.5rem; }
#footer #fnb ul { display:flex; align-items:center; flex-wrap:wrap; }
#footer #fnb ul li { padding-right:0.5rem; }
#footer #fnb ul li:after { content:"｜"; padding-left:0.5rem; color:var(--color-tone-500); }
#footer #fnb ul li:last-child { padding-right:0; font-weight:500; }
#footer #fnb ul li:last-child:after { content:""; padding-left:0; }
@media all and (max-width:1200px) {
	#footer { font-size:13px; }
	#footer .inner { gap:1rem; }
}

@media all and (max-width:768px) {
	#footer .inner { flex-direction:column; }
	#footer .logo a { height:32px; }
	#footer .logo a img { max-height:32px; }
}


.mo-only { display:none; }
@media all and (max-width:1200px) {
	.pc-only { display:none; }	
}
@media all and (max-width:768px) {
	.ta-only { display:none; }
	.mo-only { display:block; }
}