
@charset "utf-8";
@font-face { font-family: 'PretendardBk'; font-weight: 900; font-display: swap; src: local('Pretendard Black'), url('./fonts/Pretendard-Black.woff2') format('woff2'), url('./fonts/Pretendard-Black.woff') format('woff');}
@font-face { font-family: 'PretendardEB'; font-weight: 800; font-display: swap; src: local('Pretendard ExtraBold'), url('./fonts/Pretendard-ExtraBold.woff2') format('woff2'), url('./fonts/Pretendard-ExtraBold.woff') format('woff');}
@font-face { font-family: 'PretendardB'; font-weight: 700; font-display: swap; src: local('Pretendard Bold'), url('./fonts/Pretendard-Bold.woff2') format('woff2'), url('./fonts/Pretendard-Bold.woff') format('woff');}
@font-face { font-family: 'PretendardSB'; font-weight: 600; font-display: swap; src: local('Pretendard SemiBold'), url('./fonts/Pretendard-SemiBold.woff2') format('woff2'), url('./fonts/Pretendard-SemiBold.woff') format('woff');}
@font-face { font-family: 'PretendardM'; font-weight: 500; font-display: swap; src: local('Pretendard Medium'), url('./fonts/Pretendard-Medium.woff2') format('woff2'), url('./fonts/Pretendard-Medium.woff') format('woff');}
@font-face { font-family: 'PretendardR'; font-weight: 400; font-display: swap; src: local('Pretendard Regular'), url('./fonts/Pretendard-Regular.woff2') format('woff2'), url('./fonts/Pretendard-Regular.woff') format('woff');}
@font-face { font-family: 'PretendardL'; font-weight: 300; font-display: swap; src: local('Pretendard Light'), url('./fonts/Pretendard-Light.woff2') format('woff2'), url('./fonts/Pretendard-Light.woff') format('woff');}
@font-face { font-family: 'PretendardEL'; font-weight: 200; font-display: swap; src: local('Pretendard ExtraLight'), url('./fonts/Pretendard-ExtraLight.woff2') format('woff2'), url('./fonts/Pretendard-ExtraLight.woff') format('woff');}
@font-face { font-family: 'PretendardT'; font-weight: 100; font-display: swap; src: local('Pretendard Thin'), url('./fonts/Pretendard-Thin.woff2') format('woff2'), url('./fonts/Pretendard-Thin.woff') format('woff');}
@font-face { font-family: 'PretendardJP'; font-weight: 400; font-display: swap; src: local('Pretendard JP Regular'), url('./fonts/PretendardJP-Regular.woff2') format('woff2'), url('./fonts/PretendardJP-Regular.woff') format('woff');}

@font-face { font-family: 'GmarketL'; font-display: swap; src: local('GmarketSansLight'), url('./fonts/GmarketSansLight.woff2') format('woff2'), url('./fonts/GmarketSansLight.woff') format('woff');}
@font-face { font-family: 'GmarketM'; font-display: swap; src: local('GmarketSansMedium'), url('./fonts/GmarketSansMedium.woff2') format('woff2'), url('./fonts/GmarketSansMedium.woff') format('woff');}
@font-face { font-family: 'GmarketB'; font-display: swap; src: local('GmarketSansBold'), url('./fonts/GmarketSansBold.woff2') format('woff2'), url('./fonts/GmarketSansBold.woff') format('woff');}
@font-face {font-family: 'NotoSSB'; font-weight: 400; font-display: swap; src: url('./fonts/NotoSerifKR-SemiBold.woff2') format('woff2'), url('./fonts/NotoSerifKR-SemiBold.woff') format('woff');}
@font-face {font-family: 'NotoSSBNb'; font-weight: 400; font-display: swap; src: local('NotoSerifKR SemiBold'), url('./fonts/NotoSerifKR-SemiBold.woff2') format('woff2'), url('./fonts/NotoSerifKR-SemiBold.woff') format('woff');unicode-range: U+0030-0039;}
@font-face {font-family: 'NotoSBNb'; font-weight: 400; font-display: swap; src: local('NotoSerifKR Bold'), url('./fonts/NotoSerifKR-Bold.woff2') format('woff2'), url('./fonts/NotoSerifKR-Bold.woff') format('woff');unicode-range: U+0030-0039;}
@font-face {font-family: 'BkMyungjoB';src: url("./fonts/BookkMyungjo-Bd.woff2") format('woff2');font-display: swap;}


/*=========================================================================================================
* Project     :
* File Name : main.css
* Writer       : cat
* Date         : 2023-05-00
=========================================================================================================*/



/*=========================================================================================================
* common
=========================================================================================================*/
*, *:after, *:before { margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box;-webkit-box-sizing: border-box;  -webkit-tap-highlight-color:transparent;}
*:focus { outline: none; }
html, body {margin: 0; padding: 0; width: 100%; height: 100%; font-size: 100%; -webkit-text-size-adjust: none;}
body { color: #fff; font-family: 'PretendardR',"맑은 고딕", "Malgun Gothic", Arial, sans-serif; font-weight: 100%; touch-action: none;}
ul, li, ol {list-style: none; }
fieldset{border: none;}
caption, legend{visibility:hidden; overflow:hidden; width:0; height:0; font-size:0; line-height:0;}
h1, h2, h3, h4, h5 { margin: 0; padding: 0; font-weight: normal;}
a { text-decoration: none; outline:none; select-dummy: expression(this.hideFocus=true);  }
a:link, a:active, a:visited { color: #fff; text-decoration: none; }
img { border: 0; vertical-align:top;}
table{border-collapse: collapse;}
em,address{font-style: normal;}
#skipnavi, .hidden{ width:0; height:0; font-size:0; line-height:0; overflow:hidden; visibility:hidden; }
a{ text-decoration:none; outline: none;  -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; select-dummy: expression(this.hideFocus=true);  }
a:visited,a:hover,a:active,a:focus{ background: none; -webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent; }
input, select, textarea {font-family: 'GmarketB'}

.fBM { font-family: 'BkMyungjoB'; display: inline-block; margin-top:-1px; vertical-align:top; }
.dtWordList .fBM { margin-top:-6px; margin-left: 3px; }
.dtWordList .fBM sup{font-size: 10px; font-family: 'NotoSSBNb';}
.menuList .fBM { margin-top:-10px; margin-left: 6px; }


.wrap { --main-color:#FFB132; --main2-color:#74C273; }

body.dv_mob{overflow: hidden; overscroll-behavior-y: none;}
.wrap { position:relative; overflow:hidden; transition: background .3s; height: 100%;}
.wrap.main { background:var(--main-color);}
.wrap.main2 { background:var(--main2-color);}
.wrap.word { background: #FDC839;}
.wrap .container{ width: 1280px; height: 720px; position: relative;}
.wrap .bg { display:inline-block; opacity:0; width:100%; height:100%; position:absolute; top:0; left:0; background: rgba(0,0,0,0.3); transition: all .3s;}
.wrap .bg.on { opacity:1;}
.wrap.word .bg { top: 720px; background: #fff;}
.wrap.word .bg.on { top:0; opacity:1; transition-delay: .3s;}
.Sprite{display: inline-block; background-repeat: no-repeat; background-position: 0px 0px;}


/* loading guide */
.webload { width:100%; height:100%; position:fixed; top:0; left:0; background: var(--main-color);z-index:10; display:flex; align-items:center;justify-content:center;}
.webload .infobox p { font-size: 23px; color: #fff; line-height:30px; font-family: 'PretendardB'; text-align:center;}
.webload .infobox .btnbox { margin-top:20px;  text-align:center; }
.webload .infobox .btnbox span { display:inline-block; margin: 0 5px; width:90px; height: 46px; font-size:15px; color: #fff; line-height:46px; background: #000; border-radius: 46px; font-family: 'PretendardB'; cursor: pointer; -webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;}


/* mousewheel section */
.mousewrap { position: absolute; width: 150px; height: 150px; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; z-index:1;}
.mousewrap .scrollBox {position: absolute; width: 150px; height: 150px; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: rgba(0, 0, 0, 0.76);border-radius: 50%;}
.mousewrap .mouseIco { position: relative; width: 32px; height: 48px; border-radius: 30px; border: 2px solid #fff; top: 39px; left: 50%; transform: translateX(-50%); }
.mousewrap .mouseIco::before,
.mousewrap .mouseIco::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; }
.mousewrap .mouseIco::before { background-color: rgba(255, 255, 255, 0.3); top: -10px; width: 2px; height: 14px;}
.mousewrap .scrollmnt {position: absolute; width: 150px; bottom: 39px; left: 50%; transform: translateX(-50%); opacity: 1; font-size: 14px; letter-spacing: -0.025em; text-align: center;}
.mousewrap.on { opacity:1;}
.mousewrap.on .scrollBox { animation: fadeani .5s forwards , fadeani .3s 2.8s forwards reverse; }
.mousewrap.on .mouseIco::after { background-color: #fff; top: -18px; width: 2px; height: 6px; animation: wheel1 1.5s cubic-bezier(0.165, 0.44, 0.64, 1) infinite; animation-direction: alternate;}
@keyframes wheel1 { 0% {transform: translateY(0);} 35%{transform: translateY(8px);} 65%{transform: translateY(0);} 100% {transform: translateY(8px);} }
@keyframes wheel2 { 0% {transform: translateY(0)scaleY(1);} 20% { transform: translateY(8px) scaleY(1.2); } 80% { transform: translateY(0px) scaleY(1.2); } 100% { transform: translateY(8px) scaleY(1); } }
@keyframes fadeani { 0% { opacity: 0; } 100% { opacity: 1;} }


/* chulPop */
.chulPop { opacity:0; width:100%; height:100%; position:fixed; top:0; left:0; background: rgba(0,0,0,0.6); z-index:0; display:flex; align-items:center;justify-content:center;  pointer-events:none; transition: opacity .3s .2s, z-index .3s;}
.chulPop .inbox { opacity:0; width:506px; height:298px; border-radius:20px; background: #fff; overflow: hidden; transform: scale(0); transition: opacity .3s, transform .3s; }
.chulPop .inbox .topbox { padding: 32px 40px 26px;}
.chulPop .inbox .topbox h3 { margin-bottom:17px; font-size:30px; color: #000; line-height:42px; letter-spacing:-0.075em; font-family: 'GmarketB'; font-weight:normal; }
.chulPop .inbox .topbox li { margin-top:16px; padding-left:30px; font-size:18px; color: #000; line-height:26px; letter-spacing: -0.025em; font-family: 'PretendardR'; text-align:justify; position:relative;}
.chulPop .inbox .topbox li:first-child { margin-top:0; }
.chulPop .inbox .topbox li:before { content:''; display:inline-block; top:3px; left:0; width:20px; height:20px; border-radius:100%; position:Absolute; background: #6a7485 url('../images/chulPop_ico.png') no-repeat center;}
.chulPop .inbox .btbtn { height:62px; font-size:18px; color: #fff; line-height: 62px; font-family: 'PretendardB'; text-align:center; background: #6a7485; cursor: pointer;}
.chulPop.on { opacity:1; z-index:10; pointer-events:auto; transition: opacity .3s; }
.chulPop.on .inbox { opacity:1; transform: scale(1); }




/*=========================================================================================================
* mainPage
=========================================================================================================*/
.mainPage { height: 100%; position:relative; }
.mainPage.icp { background: var(--main2-color);}

/* main header */
.mainPage .header { opacity:0; width:100%; position:absolute; top:0; left:0; z-index:-1; pointer-events:none; transition:z-index 0s .5s, opacity .3s;}
.mainPage .header .leftbox { min-width: 300px; position:absolute; top:40px; left:50px;}
.mainPage .header .leftbox h1 { margin-bottom: 37px; font-size: 24px; line-height:28px; letter-spacing: -0.05em; font-family: 'PretendardEB'; position:relative; white-space:nowrap;}
.mainPage .header .leftbox .ichim { display:inline-block; text-indent: -36px; width:0; vertical-align:top; overflow:hidden; transition: all .3s ease-out;}
.mainPage .header .leftbox h1:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header .leftbox h2 { height: 116px; font-size: 110px; line-height:116px; letter-spacing: -0.025em; font-family: 'PretendardBK'; transition: height .3s; margin-left: -4px;}
.mainPage .header .leftbox h2 span { display:block; height: 116px; overflow:hidden; position:relative; }
.mainPage .header .leftbox h2 em { display:inline-block; position:relative; top:116px; }
.mainPage .header .leftbox h2.on { transition: height .3s;}
.mainPage .header .leftbox h2.on em { top:0; transition: top .8s cubic-bezier(.94,-0.01,.6,1.01);}
.mainPage .header .leftbox h2.on span:nth-child(2) em { transition-delay: .1s;}
.mainPage .header .leftbox ul { margin-top:34px; }
.mainPage .header .leftbox li { font-size:24px; line-height:34px; letter-spacing: -0.025em; font-family: 'PretendardEB'; white-space:nowrap; position:relative; overflow:hidden; transition: opacity .3s;}
.mainPage .header .leftbox li:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header .leftbox li > span { padding-right: 16px; display:inline-block; cursor: pointer; position:relative; top:34px;}
.mainPage .header .leftbox li > span:after {content:''; display:inline-block; margin-top:-6px; width:8px; height:12px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.137' height='20.617'%3E%3Cpath d='M2233.323,101.487l8.894,8.894,8.894-8.894' transform='translate(-100.073 2252.526) rotate(-90)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") no-repeat center/7px auto; position:absolute; top:50%; right:0; }
.mainPage .header .leftbox li > span:hover:after { animation: .3s cubic-bezier(.17,.67,.7,1.55) 0s 1 hd_leftbox_ul_ico;}
.mainPage .header .leftbox ul.on li > span { top:0px; transition: top .3s; }
.mainPage .header .leftbox ul.on li:nth-child(2) > span { transition-delay: .1s;}
.mainPage .header .leftbox p { font-size: 16px; line-height:34px; letter-spacing: -0.025em; font-family: 'PretendardSB'; position:Absolute; top:608px; left:0; -webkit-font-smooting: antialiased; backface-visibility: hidden; transform: translateZ(0); }
.mainPage .header .leftbox p:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header .leftbox p > em {display:inline-block; line-height: 20px; height: 20px; vertical-align:middle;}
.mainPage .header .leftbox p .bar { display:inline-block; margin: 16px 8px 0; width:0px; height:2px;  vertical-align:top; position: relative; transition: width .3s; background-color: #fff;}
.mainPage .header .title.on ~ p .bar{ width: 30px; right: auto; left: 0; transition: width .3s .3s;}
.dv_mob.ios .mainPage .header .leftbox p .bar { margin-top: 19px; }

.mainPage .header .leftbox p .ichim {text-indent: -28px; line-height: 20px; height: 20px; vertical-align:middle;}
.mainPage .header .leftbox p .num { transition: width .3s; display:inline-block; height:20px; line-height:20px; text-align:right; position:Relative; overflow:hidden; vertical-align:middle; white-space:nowrap;}
.mainPage .header .leftbox p .num em { display:block; position:Relative; top:0px; }
.mainPage .header .leftbox p.on .num em { top:-20px; transition: top .3s;}
.mainPage .header.on { opacity:1; pointer-events:auto; z-index:10; transition:z-index 0s;}
.mainPage .header.on .leftbox h1:after,
.mainPage .header.on .leftbox p:after,
.mainPage .header.on .leftbox li:after { width:0; transition: width .5s .1s ease-out; }
.mainPage .header.on .leftbox li:nth-child(1):after { transition-delay: .2s;}
.mainPage .header.on .leftbox li:nth-child(2):after { transition-delay: .3s;}
.mainPage .header.on .leftbox p:after { transition-delay: .4s;}
.mainPage.opList .leftbox li { opacity:.2;}
.mainPage.opList .leftbox li.on { opacity:1;}
@keyframes hd_leftbox_ul_ico {0% { opacity:0; right:15px; }100% { opacity:1; right:0; }}

.mainPage .header .topmenu { font-size:0; position:absolute; top:40px; right:50px; z-index:1; transition: opacity .3s, z-index .3s .3s;}
.mainPage .header .top_left_menu {display:inline-block; vertical-align:top;}
.mainPage .header .top_left_menu li { display:inline-block; padding: 0 8px; font-size:16px; line-height:30px; font-family: 'PretendardEB'; vertical-align:top; cursor: pointer; position:relative;}
.mainPage .header .top_left_menu li:first-child { margin-right: 32px;}
.mainPage .header .top_left_menu li:last-child { margin-right: 45px;}
.mainPage .header .top_left_menu li:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header .top_left_menu li span { display:inline-block; position:Relative;}
.mainPage .header .top_left_menu li span em { display:inline-block; width:0; height:2px; background: #fff; position:absolute; bottom:-1px; right:0; transition: width .3s;}
.dv_pc .mainPage .header .top_left_menu li:hover span em { width:100%; right:auto; left:0;}
.mainPage .header .top_left_menu li .ichim { display:inline-block; text-indent: 0px; width:28px; vertical-align:top; overflow:hidden; transition: all .3s ease-out;}
.mainPage .header .top_right_menu { display:inline-block; margin-right:15px; padding-left:20px; position: relative; }
.mainPage .header .top_right_menu .classbtn {margin-left:-22px; padding-left:22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.414' height='37.414'%3E%3Cg transform='translate(-1993.5 -85.5)'%3E%3Cline x2='20' y2='20' transform='translate(2009.5 101.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3Cline x2='6' y2='6' transform='translate(1998.5 90.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3Cline y1='6' x2='6' transform='translate(2016.5 91.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3Cline y1='6' x2='6' transform='translate(1999.5 108.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3Cline x2='7' transform='translate(1993.5 102.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3Cline y1='7' transform='translate(2010.5 85.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/g%3E%3C/svg%3E") no-repeat left 4px/18px auto; vertical-align:top; cursor: pointer; position:relative; }
.mainPage .header .top_right_menu .classbtn span { display:inline-block; padding-right:15px; font-size:16px; line-height:30px; font-family: 'PretendardEB'; letter-spacing:-0.038em; position:Relative; }
.mainPage .header .top_right_menu .classbtn span:after { content:''; display:inline-block; margin-top:-5px; width:10px; height:10px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20.617' height='13.137'%3E%3Cpath d='M2233.323,101.487l8.894,8.894,8.894-8.894' transform='translate(-2231.909 -100.073)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") no-repeat center/100% auto; transform: rotate(0); position:absolute; top:50%; right:0; transition: transform .3s;}
.mainPage .header .top_right_menu .classbox { height:0; overflow: hidden; transition: all .1s ease-out;}
.mainPage .header .top_right_menu .classbox ul { opacity:0; transform: translate(0, -100%); transition: all .3s ease-out;}
.mainPage .header .top_right_menu .classbox li span { opacity: .3; display:inline-block; font-size:16px; line-height:28px; font-family: 'PretendardEB'; cursor: pointer; transition: opacity .3s; }
.mainPage .header .top_right_menu .classbox li span:hover { opacity:1;}
.mainPage .header .top_right_menu:hover .classbtn span:after { transform: rotate(-180deg); transition: transform .3s; }
.mainPage .header .top_right_menu:hover .classbox { height: 100%; }
.mainPage .header .top_right_menu:hover .classbox ul { opacity:1; transform: translate(0, 0); transition: all .3s ease-out; }
.mainPage .header .top_right_menu .classbtn:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header .top_right_save { display:inline-block; position: relative; vertical-align:top;}
.mainPage .header .top_right_save .classbtn {padding-left:22px; padding-right:2px; font-size:16px; line-height:30px; letter-spacing:-0.038em; font-family: 'PretendardEB'; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='36.5'%3E%3Cg transform='translate(-2292 -87)'%3E%3Cg transform='translate(2292 87)' fill='none' stroke='%23fff' stroke-width='4'%3E%3Crect width='25' height='28' stroke='none'/%3E%3Crect x='2' y='2' width='21' height='24' fill='none'/%3E%3C/g%3E%3Cg transform='translate(2313 93)' fill='none' stroke='%23fff' stroke-width='4'%3E%3Crect width='13' height='28' stroke='none'/%3E%3Crect x='2' y='2' width='9' height='24' fill='none'/%3E%3C/g%3E%3Cline y1='10' transform='translate(2294 113.5)' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/g%3E%3C/svg%3E") no-repeat 1px 4px/17px auto; vertical-align:top; cursor: pointer; position:relative; }
.mainPage .header .top_right_save .classbtn em {display:inline-block; width:0; height:2px; background: #fff; position:absolute; bottom:-1px; right:0; transition: width .3s;}
.mainPage .header .top_right_save .classbtn:hover em {width:100%; right:auto; left:0;}
.mainPage .header .top_right_save:after {content:''; display:block; width:100%; height:100%; position:absolute; top:0; right:0; background: var(--main-color); transition: width .2s ease-out;}
.mainPage .header.on .top_left_menu li:after { width:0; transition: width .3s ease-out; }
.mainPage .header.on .top_left_menu li:nth-child(1):after { transition-duration: .3s; transition-delay: .3s;}
.mainPage .header.on .top_left_menu li:nth-child(2):after { transition-delay: .4s;}
.mainPage .header.on .top_left_menu li:nth-child(3):after { transition-delay: .5s;}
.mainPage .header.on .top_left_menu li:nth-child(4):after { transition-delay: .6s;}
.mainPage .header.on .top_left_menu li:nth-child(5):after { transition-delay: .7s;}
.mainPage .header.on .top_right_menu .classbtn:after {width:0; transition: width .3s .8s ease-out; }
.mainPage .header.on .top_right_save:after {width:0; transition: width .3s 1s ease-out; }
.mainPage.opList .header .topmenu { z-index: -1; opacity:0; pointer-events:none; transition: opacity .3s, z-index .3s; }

.mainPage .header .navbox { opacity:0; padding-right: 4px; font-size:0; position:Absolute; top:246px; right:0px; transition: all .5s 1.5s; }
.mainPage .header .navbox span { display:inline-block;}
.mainPage .header .navbox > span { opacity: .2; width:20px; height:30px; cursor: pointer; transition: all .2s; position:relative; }
.mainPage .header .navbox > span.nbtn.off{pointer-events: none;}
.mainPage .header .navbox > span:after,
.mainPage .header .navbox > span:before { content:''; display:inline-block; position:Absolute; transition: all .2s; }
.mainPage .header .navbox > span:after {width:12px; height:12px; border:2px solid #fff; left:4px; transform: rotate(45deg);}
.mainPage .header .navbox > span:before { width:2px; height:0px; border-left: 2px solid #fff; left:9px;}
.mainPage .header .navbox > span.prev:after { border-right:0; border-bottom:0; top:15px; }
.mainPage .header .navbox > span.prev:before { top:18px; }
.mainPage .header .navbox > span.next:after { border-left:0; border-top:0; bottom:15px; }
.mainPage .header .navbox > span.next:before { bottom:18px; }
.mainPage .header .navbox > span:hover { opacity: 1;}
.dv_pc .mainPage .header .navbox > span:hover:before { height:20px; transition: height .2s; }
.dv_pc .mainPage .header .navbox > span.prev:hover:after { top: 7px;}
.dv_pc .mainPage .header .navbox > span.prev:hover:before { top: 7px;}
.dv_pc .mainPage .header .navbox > span.next:hover:after { bottom: 7px;}
.dv_pc .mainPage .header .navbox > span.next:hover:before { bottom: 7px;}
.mainPage .header .navbox ul { margin:12px 0; width:20px; }
.mainPage .header .navbox li { position:relative; height:24px; }
.mainPage .header .navbox li em { display:inline-block; width:20px; height:24px; opacity:.3; transition: opacity .3s; cursor: pointer;}
.mainPage .header .navbox li em:after { content:''; display:inline-block; margin: -3px -3px 0 0; width:6px; height:6px; background: #fff; border-radius:100%; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);}
.mainPage .header .navbox li span {opacity:0; font-size:19px; line-height:20px; font-family: 'PretendardSB'; position:absolute; top:0; right: 14px; white-space:nowrap; transition: all .3s; cursor: pointer; padding-right: 5px;}
.mainPage .header .navbox li:nth-child(1).in em{ transition-delay: .6s;}
.mainPage .header .navbox li:nth-child(1).in span { transition-delay: .6s;}
.mainPage .header .navbox li:nth-child(2).in span { transition-delay: .5s;}
.mainPage .header .navbox li:nth-child(3).in span { transition-delay: .4s;}
.mainPage .header .navbox li:nth-child(4).in span { transition-delay: .3s;}
.mainPage .header .navbox li:nth-child(5).in span { transition-delay: .2s;}
.mainPage .header .navbox li:nth-child(6).in span { transition-delay: .1s;}
.mainPage .header .navbox li.in.del span { opacity: 0.5; right: 24px;}
.mainPage .header .navbox li.in:nth-child(1).del span { transition-delay: .1s;}
.mainPage .header .navbox li.in:nth-child(2).del span { transition-delay: .2s;}
.mainPage .header .navbox li.in:nth-child(3).del span { transition-delay: .3s;}
.mainPage .header .navbox li.in:nth-child(4).del span { transition-delay: .4s;}
.mainPage .header .navbox li.in:nth-child(5).del span { transition-delay: .5s;}
.mainPage .header .navbox li.in:nth-child(6).del span { transition-delay: .6s;}
.mainPage .header .navbox li.on em,
.mainPage .header .navbox li:hover em { opacity:1;}
.mainPage .header .navbox li.on span,
.mainPage .header .navbox li:hover em + span { opacity:1; right:19px;}
.mainPage .header.on .navbox { opacity:1; right:48px; transition: all .5s 1.5s;}
.mainPage.opList .header .navbox li.on span,
.mainPage.opList .header .navbox li em:hover + span {opacity: .5;}

.mainPage .header .cursorbox { opacity:0; width:894px; height:488px; position:absolute; top:116px; right:116px; transition: opacity .5s 1.8s;}
.mainPage .header .cursorbox .roundC { width:140px; height:140px; position:absolute; top:4px; right:110px; pointer-events: none;}
.mainPage .header .cursorbox .roundC span { display:inline-block; width:100%; height:100%; }
.mainPage .header .cursorbox .roundC .circle_num { position:absolute; top:0; left:0; background: url('../images/circle_num1.png') no-repeat center/contain; transition: background-image .3s;}
.mainPage .header .cursorbox .roundC .circle_txt { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='248.252' height='243.37'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' d='M0 0h248.252v243.37H0z' data-name='사각형 662'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg fill='%23fff' clip-path='url(%23a)' data-name='그룹 606'%3E%3Cpath d='m169.247 22.37-.673 1.9-18.511-6.553.673-1.9 8.078 2.859 1.538-4.343 2.332.824-1.539 4.343ZM153.5 10.606c4.508.934 8.139-.4 9.243-3.094l-6.4-2.265.673-1.9 6.426 2.276.937-2.647 2.331.824-.937 2.649 6.4 2.265-.673 1.9-6.382-2.26c-.833 2.785 1.148 6.109 5.239 8.221l-1.547 1.566c-3.248-1.762-5.448-4.322-5.965-7.1-2.175 1.828-5.5 2.433-9.129 1.759Z' data-name='패스 88146'/%3E%3Cpath d='M185.572 32.774c-1.3 2.156-4.45 1.938-8.434-.469-3.964-2.394-5.643-5.092-4.34-7.248 1.29-2.135 4.458-1.9 8.422.49 3.984 2.407 5.642 5.09 4.352 7.227m5.974-5.25-1.054 1.746-16.759-10.123 1.054-1.746Zm-8.109 3.959c.682-1.129-.487-2.676-3.2-4.312s-4.6-1.94-5.285-.811c-.694 1.15.466 2.664 3.177 4.3s4.61 1.972 5.306.822m7.109-6.666-12.754-7.7 3.92-6.49 12.631 7.629-1.029 1.7-10.537-6.364-1.861 3.08 10.66 6.44Z' data-name='패스 88147'/%3E%3Cpath d='m193.343 34.791 10.477 9.663-4.782 5.185-1.816-1.676 3.431-3.722-8.661-7.987Zm3.906 1.286c-2.293-2.116-2.789-4.727-1.195-6.455 1.61-1.747 4.254-1.463 6.547.65s2.789 4.727 1.178 6.473c-1.593 1.728-4.237 1.445-6.53-.668m1.285-1.4c1.27 1.172 2.655 1.4 3.517.469.879-.953.535-2.315-.736-3.485s-2.636-1.388-3.515-.435c-.863.935-.536 2.279.734 3.451m9.41-.754-9.4-8.67 1.334-1.447 3.792 3.5 1.513-1.641L207 27.344l-1.513 1.641 3.792 3.5Zm2.721 7.633-2.258-2.082-3.871 4.2L202.719 42l9.19-9.964 1.818 1.673-3.937 4.27 2.258 2.082Z' data-name='패스 88148'/%3E%3Cpath d='m217.279 65.458-1.654 1.193-11.455-15.888 1.654-1.192 2.64 3.66 5.685-4.1 1.432 1.986-5.686 4.1 1.7 2.357 5.684-4.1 1.433 1.986-5.686 4.1ZM225 54.329l-7.679-10.65 1.635-1.18 9.125 12.656-1.85 1.334a49.2 49.2 0 0 1-8.412 5.119l-1.219-2.174a45.645 45.645 0 0 0 8.179-4.951Z' data-name='패스 88149'/%3E%3Cpath d='m231.011 90.63-3.046-8.058-7.16 2.707-.874-2.313 7.16-2.705-3-7.945 1.885-.713 6.924 18.314Zm3.156-3.117c-.733-3.57-.071-6.977 1.763-9.182-2.849-.412-5.593-2.582-7.4-5.744l1.524-1.6c2.144 3.908 5.773 5.974 8.444 4.964l1.077-.406.925 2.446-1.077.408c-2.626.992-4.009 5-3.048 9.308Z' data-name='패스 88150'/%3E%3Cpath d='m231.582 96.091 2.238 14.074-6.967 1.109-.388-2.441 5-.795-1.85-11.638Zm2.27 3.428c-.49-3.08.739-5.438 3.061-5.807 2.346-.373 4.245 1.486 4.735 4.566s-.738 5.44-3.085 5.813c-2.322.369-4.221-1.492-4.711-4.572m7.133 12.617-.485-3.036-5.64.9-.388-2.441 13.388-2.129.389 2.439-5.735.912.483 3.033Zm-5.26-12.914c.27 1.705 1.213 2.746 2.469 2.547 1.28-.2 1.854-1.487 1.582-3.192s-1.211-2.722-2.49-2.519c-1.256.2-1.833 1.457-1.561 3.164m7.854 5.238-2.009-12.631 1.943-.308.81 5.093 2.2-.349.388 2.439-2.2.352.81 5.093Z' data-name='패스 88151'/%3E%3Cpath d='M237.024 121.053c6.76.356 9.325 3.664 9.14 7.164a5.927 5.927 0 0 1-2.126 4.311l-1.6-1.6a3.786 3.786 0 0 0 1.441-2.713c.117-2.228-1.462-4.187-6.489-4.574a5.345 5.345 0 0 1 1.858 3.945c-.155 2.95-2.011 4.87-5.559 4.682a5.285 5.285 0 0 1-5.307-5.568c.177-3.356 2.983-5.948 8.64-5.649m-1.674 2.555c-3.2.119-4.757 1.311-4.855 3.182-.082 1.533 1.149 2.824 3.33 2.939 2.109.111 3.339-.881 3.439-2.75a4.122 4.122 0 0 0-1.914-3.371' data-name='패스 88152'/%3E%3Cpath d='m231.703 146.132 1.281-6.203 1.997.412-1.281 6.203z' data-name='사각형 659'/%3E%3Cpath d='M225.875 152.163c2.813 6.291 4.659 10.15 7.18 11.086a2.8 2.8 0 0 0 3.969-1.729 4.791 4.791 0 0 0-.635-3.947l1.983-.93a6.935 6.935 0 0 1 .606 5.959 4.941 4.941 0 0 1-6.714 3.2c-2.949-1.094-4.927-4.875-7.25-9.653a29.27 29.27 0 0 1-.845 2.758l-1.561 4.209-2.206-.818 3.965-10.69Z' data-name='패스 88153'/%3E%3Cpath d='m186.626 208.663-1.312-1.529 14.9-12.782 1.312 1.53-6.505 5.578 3 3.5-1.875 1.609-3-3.5Zm18.044-7.791c-3.056 3.443-3.705 7.256-1.924 9.555l5.156-4.422 1.313 1.531-5.175 4.438 1.828 2.13-1.876 1.61-1.828-2.131-5.156 4.422-1.313-1.531 5.138-4.407c-2-2.111-5.868-2.049-9.736.446l-.586-2.121c3.144-1.938 6.461-2.569 9.129-1.633-.5-2.795.629-5.977 3.023-8.789Z' data-name='패스 88154'/%3E%3Cpath d='M169.466 217.691c-1.223-2.2.532-4.827 4.6-7.088 4.05-2.25 7.225-2.366 8.449-.164 1.212 2.183-.564 4.818-4.613 7.066-4.07 2.262-7.225 2.367-8.438.186m1.586 7.794-.991-1.783 17.121-9.511.99 1.783Zm.6-9.007c.641 1.154 2.564.91 5.334-.629s3.972-3.031 3.331-4.186c-.653-1.174-2.544-.92-5.313.619s-4.005 3.022-3.352 4.2m2.25 9.486 13.029-7.24 3.684 6.631-12.9 7.17-.968-1.743L187.5 224.8l-1.749-3.147-10.888 6.051Z' data-name='패스 88155'/%3E%3Cpath d='m163.879 223.428-13.6 4.28-2.117-6.735 2.358-.742 1.52 4.834 11.246-3.537Zm-14.505 11.661 2.932-.922-1.714-5.451 2.358-.743 4.07 12.94-2.36.742-1.742-5.543-2.931.922Zm11.444-8.911c2.977-.935 5.491-.064 6.2 2.18.713 2.268-.851 4.42-3.827 5.356s-5.491.066-6.205-2.2c-.705-2.244.857-4.4 3.835-5.334m-3.465 10.352 12.208-3.838.59 1.877-4.924 1.549.67 2.131-2.36.74-.67-2.129-4.923 1.549Zm4.034-8.541c-1.649.518-2.541 1.6-2.159 2.816.388 1.239 1.741 1.618 3.39 1.1s2.518-1.6 2.129-2.834c-.381-1.215-1.712-1.6-3.36-1.082' data-name='패스 88156'/%3E%3Cpath d='m125.377 228.868-.207-2.031 19.486-1.993.207 2.032-4.489.459.713 6.972-2.436.248-.713-6.972-2.889.3.713 6.972-2.436.25-.713-6.972Zm5.789 12.244 13.062-1.336.205 2.006-15.522 1.588-.232-2.27a49.15 49.15 0 0 1-.235-9.843l2.49.035a45.7 45.7 0 0 0 .205 9.558Z' data-name='패스 88157'/%3E%3Cpath d='m96.688 228.227 8.507 1.369 1.217-7.558 2.44.392-1.217 7.559 8.389 1.351-.32 1.99-19.337-3.113Zm1.132 4.291c3.463 1.141 6.088 3.41 7.09 6.1 1.774-2.266 5.022-3.567 8.669-3.563l.631 2.119c-4.459-.086-8.058 2.033-8.512 4.854l-.184 1.136-2.583-.416.184-1.136c.446-2.774-2.346-5.969-6.56-7.28Z' data-name='패스 88158'/%3E%3Cpath d='m73.07 226.21 2.873 1.089 2.026-5.341 2.312.877-4.811 12.681-2.311-.877 2.06-5.433-2.873-1.09Zm5.374 6.068 11.964 4.539-.7 1.84-4.827-1.83-.791 2.088-2.312-.877.792-2.088-4.826-1.83Zm13.232-6.252-13.332-5.057 2.5-6.6 2.312.877-1.8 4.736 11.02 4.18Zm-4.105.266c2.918 1.107 4.353 3.345 3.518 5.546-.842 2.221-3.4 2.946-6.32 1.838s-4.353-3.345-3.511-5.568c.835-2.2 3.395-2.924 6.313-1.816m-.673 1.773c-1.616-.613-2.988-.312-3.439.877-.46 1.213.367 2.348 1.983 2.961s2.966.3 3.426-.908c.451-1.19-.354-2.317-1.97-2.93' data-name='패스 88159'/%3E%3Cpath d='M67.315 218.316c-3.689 5.675-7.836 6.244-10.773 4.334a5.932 5.932 0 0 1-2.671-4l2.184-.584a3.786 3.786 0 0 0 1.628 2.6c1.872 1.215 4.358.826 7.2-3.334a5.344 5.344 0 0 1-4.344-.361c-2.476-1.61-3.212-4.176-1.277-7.155a5.286 5.286 0 0 1 7.476-1.812c2.818 1.83 3.66 5.555.574 10.3m-1.377-2.727c1.5-2.834 1.241-4.775-.328-5.795-1.287-.836-3.021-.416-4.211 1.414-1.15 1.772-.906 3.334.664 4.354a4.122 4.122 0 0 0 3.875.027' data-name='패스 88160'/%3E%3Cpath d='m46.892 202.706 1.354-1.525 4.737 4.206-1.353 1.525z' data-name='사각형 660'/%3E%3Cpath d='M45.927 193.12c-6.854-.689-11.119-1.01-13.184.713a2.8 2.8 0 0 0-.475 4.3 4.792 4.792 0 0 0 3.739 1.412l-.181 2.181a6.926 6.926 0 0 1-5.469-2.437 4.94 4.94 0 0 1 .57-7.412c2.415-2.012 6.677-1.848 11.977-1.487a28.763 28.763 0 0 1-1.973-2.1l-2.874-3.447 1.807-1.506 7.3 8.756Z' data-name='패스 88161'/%3E%3Cpath d='M14.195 150.483c-1.457-4.367-4.437-6.836-7.318-6.439l1.256 6.676-1.982.373-1.26-6.7-2.76.519-.458-2.43 2.761-.519-1.257-6.676 1.981-.373 1.252 6.652c2.828-.679 4.707-4.062 4.477-8.66l2.13.553c.11 3.691-1 6.881-3.144 8.725 2.673.962 4.865 3.531 6.106 7.009Zm2.26-19.527 1.981-.373 3.632 19.3-1.981.373-1.587-8.425-4.529.854-.457-2.43 4.529-.854Z' data-name='패스 88162'/%3E%3Cpath d='m7.822 111.321-.237 14.906L0 126.106l.235-14.762 1.992.034-.2 12.312 3.6.057.2-12.457Zm1.836-2.227 2.04.034-.311 19.584-2.04-.032Zm7.546 2.522c2.521.039 3.916 2.871 3.842 7.527-.073 4.631-1.559 7.442-4.079 7.4-2.5-.039-3.891-2.895-3.818-7.528.075-4.656 1.559-7.441 4.055-7.4m-.039 2.5c-1.32-.021-2.069 1.768-2.119 4.936s.641 4.955 1.961 4.976c1.345.022 2.068-1.744 2.119-4.912s-.617-4.979-1.961-5' data-name='패스 88163'/%3E%3Cpath d='m6.895 91.7-2.74 12.492-1.922-.422 1.105-5.039-2.18-.478.53-2.414 2.179.478 1.106-5.037Zm5.218-6.2-.659 3 5.578 1.225-.532 2.415-13.24-2.907.53-2.414 5.672 1.244.658-3Zm2.034 14.35c-.668 3.046-2.673 4.794-4.97 4.291-2.32-.51-3.409-2.936-2.741-5.983s2.673-4.793 4.993-4.283c2.3.5 3.387 2.928 2.718 5.975m-1.852-.4c.37-1.687-.128-3-1.37-3.273-1.266-.278-2.268.705-2.638 2.392s.133 2.979 1.4 3.256c1.242.272 2.239-.687 2.609-2.375m2.714 4.426 3.054-13.926 6.89 1.512-.53 2.414-4.945-1.084-2.525 11.508Z' data-name='패스 88164'/%3E%3Cpath d='m15.934 66.7-5.342 11.992-1.842-.82L15.1 63.62l2.083.927a49.233 49.233 0 0 1 8.655 4.7l-1.268 2.142a45.741 45.741 0 0 0-8.393-4.58Zm13.5 1.074 1.864.83L23.331 86.5l-1.865-.83 1.834-4.128-6.4-2.852 1-2.236 6.4 2.851 1.182-2.652-6.4-2.852 1-2.238 6.4 2.852Z' data-name='패스 88165'/%3E%3Cpath d='M40.021 42.1c-2.718 2.431-6 3.572-8.826 3.1 1.078 2.67.583 6.133-1.241 9.292l-2.151-.51c2.3-3.823 2.261-8 .044-9.8l-.9-.727 1.65-2.031.894.727c2.18 1.771 6.344.949 9.583-2.049Zm4.283 1.16-5.434 6.684 5.944 4.829-1.56 1.918-5.943-4.829-5.359 6.6-1.564-1.271 12.352-15.2Z' data-name='패스 88166'/%3E%3Cpath d='M49.888 25.417 40 33.532l-1.25-1.521 3.99-3.274-1.417-1.726 1.911-1.569 1.417 1.727L48.64 23.9Zm.65 10.893c-2.412 1.98-5.068 2.111-6.561.293-1.507-1.838-.861-4.418 1.551-6.4s5.069-2.111 6.576-.273c1.493 1.818.847 4.4-1.566 6.377m-1.2-1.465c1.336-1.1 1.758-2.438.951-3.42-.823-1-2.219-.85-3.555.246s-1.739 2.422-.917 3.424c.807.982 2.185.846 3.521-.25m8.492-11.069-2.375 1.95 3.625 4.416-1.915 1.571-8.6-10.484 1.911-1.569 3.686 4.491 2.375-1.95ZM48.725 40l11.021-9.045 4.477 5.455-1.911 1.569-3.212-3.913-9.11 7.478Z' data-name='패스 88167'/%3E%3Cpath d='M67.524 22.7c-3.094-6.022-1.527-9.9 1.59-11.5a5.923 5.923 0 0 1 4.794-.332l-.576 2.185a3.788 3.788 0 0 0-3.07.12c-1.985 1.021-2.881 3.371-.684 7.908a5.342 5.342 0 0 1 2.472-3.592c2.626-1.35 5.219-.713 6.843 2.447a5.285 5.285 0 0 1-2.14 7.387c-2.989 1.537-6.64.418-9.229-4.619m3.05.158c1.716 2.707 3.527 3.449 5.192 2.594 1.367-.7 1.863-2.414.865-4.358-.966-1.877-2.443-2.441-4.108-1.586a4.123 4.123 0 0 0-1.949 3.35' data-name='패스 88168'/%3E%3Cpath d='m85.201 14.757 6.006-2.015.648 1.934-6.005 2.015z' data-name='사각형 661'/%3E%3Cpath d='M100 16.68c4.023-5.6 6.431-9.131 5.972-11.781a2.8 2.8 0 0 0-3.491-2.56 4.788 4.788 0 0 0-3.092 2.532l-1.8-1.246A6.934 6.934 0 0 1 102.438.1a4.942 4.942 0 0 1 6.137 4.2c.537 3.1-1.735 6.709-4.7 11.122a29.241 29.241 0 0 1 2.81-.659L111.11 14l.4 2.319-11.235 1.949Z' data-name='패스 88169'/%3E%3Cpath d='M133.576 5.9a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88170'/%3E%3Cpath d='M24.884 171.231a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88171'/%3E%3Cpath d='M220.5 184.366a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88172'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / 124px 122px;}
.mainPage .header .cursorbox .roundC .circle_txt { animation: 15s linear 0s infinite intro_circle_ani; transition: background .3s;}
.mainPage.icp .header .cursorbox .roundC .circle_txt {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='248.422' height='245.419'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' d='M0 0h248.422v245.419H0z' data-name='사각형 682'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg fill='%23fff' clip-path='url(%23a)' data-name='그룹 615'%3E%3Cpath d='m169.246 22.371-.672 1.9-18.511-6.554.673-1.9 8.078 2.86 1.538-4.344 2.332.825-1.539 4.342ZM153.5 10.607c4.508.934 8.139-.4 9.243-3.094l-6.4-2.266.672-1.9 6.427 2.276.937-2.648 2.331.825-.937 2.648 6.4 2.266-.674 1.9-6.381-2.26c-.834 2.786 1.148 6.11 5.238 8.221l-1.546 1.566c-3.248-1.761-5.448-4.322-5.965-7.1-2.176 1.828-5.5 2.434-9.129 1.759Z' data-name='패스 88281'/%3E%3Cpath d='M185.572 32.773c-1.3 2.157-4.45 1.938-8.434-.469-3.964-2.394-5.644-5.091-4.341-7.247 1.291-2.136 4.459-1.9 8.422.489 3.984 2.408 5.643 5.091 4.353 7.227m5.974-5.249-1.054 1.745-16.759-10.122 1.054-1.746Zm-8.11 3.959c.683-1.13-.486-2.676-3.2-4.313s-4.6-1.94-5.286-.81c-.693 1.149.467 2.663 3.178 4.3s4.61 1.972 5.305.822m7.11-6.666-12.755-7.7 3.921-6.49 12.631 7.629-1.03 1.7-10.536-6.365-1.861 3.081 10.66 6.439Z' data-name='패스 88282'/%3E%3Cpath d='m210.6 51.01-5.965-6.217-5.525 5.3-1.711-1.783 5.525-5.3-5.882-6.13 1.454-1.4 13.554 14.135Zm1.681-4.107c-2.077-3-2.805-6.39-1.983-9.14-2.784.741-6.159-.177-9.067-2.377l.769-2.072c3.507 2.755 7.657 3.232 9.717 1.254l.831-.8 1.812 1.888-.832.8c-2.025 1.944-1.723 6.176.852 9.76Z' data-name='패스 88283'/%3E%3Cpath d='m213.295 55.8 7.613 12.056-5.967 3.767-1.32-2.09 4.283-2.7-6.294-9.964Zm3.44 2.256c-1.667-2.638-1.467-5.29.521-6.546 2.01-1.27 4.49-.309 6.156 2.329s1.467 5.291-.542 6.56c-1.989 1.255-4.469.3-6.135-2.343m1.6-1.012c.924 1.461 2.2 2.045 3.276 1.365 1.1-.691 1.117-2.1.2-3.557s-2.188-2.026-3.284-1.333c-1.076.679-1.109 2.063-.187 3.525m9.933 9.794-1.64-2.6-4.833 3.052-1.32-2.09 11.467-7.242 1.321 2.09-4.912 3.1 1.641 2.6Zm-.646-8.08-6.831-10.816 1.664-1.052 2.756 4.363 1.888-1.191 1.32 2.09-1.888 1.192 2.755 4.363Z' data-name='패스 88284'/%3E%3Cpath d='m230.511 88.971-7.272 2.749-.874-2.312 5.387-2.036-4.293-11.357 1.885-.713Zm4.877-8.2c-2.873 1.086-5.736-.449-6.9-3.525-1.172-3.1-.039-6.141 2.834-7.227s5.736.448 6.906 3.546c1.163 3.075.031 6.12-2.842 7.206m-3.207-8.486a3.343 3.343 0 1 0 4.1 2.018 3.074 3.074 0 0 0-4.1-2.018m11.348 11.77-11.985 4.53-.874-2.312 11.986-4.531Z' data-name='패스 88285'/%3E%3Cpath d='m232.189 97.012 2.228 14-7.157 1.139-2.227-14Zm-4.832 3.223 1.466 9.219 3.294-.525-1.466-9.217Zm6.706-.312c-.507-3.176.675-5.527 3-5.9s4.174 1.5 4.68 4.674-.677 5.525-3 5.9-4.175-1.5-4.678-4.673m14.358 8.867-12.962 2.062-.387-2.441 12.962-2.062Zm-12.535-9.158c.286 1.8 1.229 2.841 2.486 2.642s1.829-1.481 1.543-3.283-1.23-2.841-2.486-2.642-1.83 1.482-1.543 3.283m7.759 5.4-2.058-12.938 1.944-.31.836 5.261 2.3-.366.388 2.441-2.3.366.832 5.236Z' data-name='패스 88286'/%3E%3Cpath d='M237.024 121.053c6.76.357 9.325 3.665 9.14 7.165a5.933 5.933 0 0 1-2.126 4.311l-1.6-1.6a3.782 3.782 0 0 0 1.441-2.712c.117-2.229-1.462-4.188-6.49-4.574a5.344 5.344 0 0 1 1.859 3.944c-.156 2.95-2.011 4.871-5.56 4.683a5.288 5.288 0 0 1-5.307-5.569c.178-3.356 2.983-5.947 8.641-5.649m-1.674 2.556c-3.2.119-4.757 1.311-4.855 3.181-.082 1.534 1.148 2.825 3.33 2.94 2.109.111 3.339-.881 3.439-2.751a4.122 4.122 0 0 0-1.914-3.37' data-name='패스 88287'/%3E%3Cpath d='m231.701 146.132 1.281-6.203 1.998.412-1.281 6.204z' data-name='사각형 679'/%3E%3Cpath d='M225.875 152.163c2.813 6.291 4.658 10.15 7.18 11.085a2.8 2.8 0 0 0 3.968-1.728 4.789 4.789 0 0 0-.634-3.948l1.982-.929a6.932 6.932 0 0 1 .607 5.959 4.94 4.94 0 0 1-6.714 3.195c-2.95-1.094-4.927-4.874-7.25-9.653a29.497 29.497 0 0 1-.845 2.759l-1.561 4.209-2.206-.818 3.965-10.691Z' data-name='패스 88288'/%3E%3Cpath d='m186.625 208.663-1.312-1.53 14.9-12.782 1.312 1.531-6.505 5.578 3 3.5-1.875 1.609-3-3.5Zm18.045-7.791c-3.056 3.442-3.705 7.256-1.924 9.555l5.156-4.422 1.313 1.53-5.175 4.438 1.828 2.131-1.876 1.61-1.828-2.132-5.156 4.418-1.313-1.53 5.138-4.407c-2-2.111-5.868-2.049-9.736.446l-.587-2.122c3.144-1.938 6.461-2.569 9.13-1.632-.5-2.8.628-5.978 3.022-8.79Z' data-name='패스 88289'/%3E%3Cpath d='M169.466 217.691c-1.224-2.2.532-4.827 4.6-7.088 4.049-2.25 7.225-2.367 8.449-.164 1.212 2.182-.564 4.817-4.613 7.066-4.07 2.262-7.225 2.367-8.438.186m1.586 7.794-.991-1.783 17.12-9.512.991 1.783Zm.6-9.007c.642 1.154 2.564.909 5.334-.63s3.973-3.03 3.332-4.185c-.653-1.175-2.544-.921-5.313.618s-4.005 3.022-3.353 4.2m2.25 9.486 13.029-7.24 3.684 6.631-12.9 7.169-.968-1.742L187.5 224.8l-1.748-3.148-10.888 6.051Z' data-name='패스 88290'/%3E%3Cpath d='m141.232 230.295 8.365-2.071-1.84-7.433 2.4-.594L152 227.63l8.248-2.042.484 1.958-19.011 4.706Zm2.722 3.505c3.634-.306 6.937.756 8.912 2.839.746-2.781 3.226-5.25 6.583-6.675l1.41 1.7c-4.136 1.667-6.619 5.026-5.933 7.8l.277 1.118-2.539.629-.277-1.119c-.675-2.726-4.495-4.574-8.886-4.13Z' data-name='패스 88291'/%3E%3Cpath d='m118.691 237.7 3.07-.125-.232-5.709 2.47-.1.552 13.553-2.471.1-.236-5.8-3.07.125Zm17.044-7.47-14.249.58-.287-7.052 2.47-.1.206 5.06 11.778-.479Zm-9.719 10.943 12.785-.52.08 1.967-5.156.21.09 2.23-2.471.1-.09-2.231-5.158.21Zm6.045-9.088c3.119-.126 5.318 1.37 5.414 3.72.1 2.375-1.974 4.045-5.092 4.172s-5.318-1.369-5.414-3.744c-.1-2.351 1.975-4.021 5.092-4.148m.078 1.9c-1.728.07-2.871.886-2.82 2.157.052 1.3 1.259 2.016 2.986 1.946s2.848-.885 2.8-2.181c-.052-1.272-1.234-1.992-2.961-1.922' data-name='패스 88292'/%3E%3Cpath d='M96.162 242.364 98.2 229.71l2.441.393-2.041 12.654Zm2.213-13.744 1.236-7.678 2.44.393-.915 5.688 11.991 1.929-.321 1.991Zm4.69 8.316c.488-3.034 3.245-4.753 6.491-4.231 3.27.527 5.348 3.025 4.86 6.058s-3.245 4.754-6.515 4.226c-3.247-.522-5.324-3.02-4.836-6.053m8.958 1.442a3.344 3.344 0 1 0-3.791 2.55 3.073 3.073 0 0 0 3.791-2.55' data-name='패스 88293'/%3E%3Cpath d='m72.275 234.329 4.657-12.278 2.312.877-4.657 12.278Zm5.639-2.277L90.17 236.7l-.7 1.841-4.984-1.89-.826 2.177-2.311-.877.826-2.177-4.96-1.881Zm12.658-5.952-13.265-5.032 2.572-6.779 13.265 5.031Zm-.393-5.8-8.732-3.313-1.183 3.121L89 223.417Zm-3.064 5.975c3.008 1.141 4.461 3.335 3.627 5.536s-3.377 2.878-6.385 1.737-4.46-3.335-3.626-5.535 3.376-2.878 6.384-1.738M86.46 228c-1.706-.647-3.078-.347-3.529.844s.376 2.324 2.082 2.971 3.078.346 3.529-.843-.376-2.326-2.082-2.972' data-name='패스 88294'/%3E%3Cpath d='M67.314 218.315c-3.688 5.675-7.835 6.244-10.772 4.335a5.928 5.928 0 0 1-2.671-4l2.184-.585a3.776 3.776 0 0 0 1.629 2.6c1.871 1.216 4.357.827 7.2-3.334a5.341 5.341 0 0 1-4.344-.361c-2.475-1.609-3.212-4.176-1.277-7.155a5.287 5.287 0 0 1 7.476-1.812c2.818 1.83 3.659 5.555.573 10.305m-1.376-2.727c1.5-2.833 1.241-4.774-.329-5.794-1.286-.837-3.02-.417-4.211 1.414-1.149 1.772-.9 3.333.665 4.353a4.119 4.119 0 0 0 3.875.027' data-name='패스 88295'/%3E%3Cpath d='m46.892 202.706 1.354-1.525 4.737 4.205-1.354 1.525z' data-name='사각형 680'/%3E%3Cpath d='M45.927 193.12c-6.854-.69-11.12-1.01-13.185.712a2.8 2.8 0 0 0-.474 4.3 4.792 4.792 0 0 0 3.739 1.412l-.181 2.181a6.93 6.93 0 0 1-5.469-2.438 4.938 4.938 0 0 1 .57-7.411c2.415-2.013 6.677-1.848 11.976-1.487a30.254 30.254 0 0 1-1.973-2.1l-2.873-3.446 1.807-1.506 7.3 8.756Z' data-name='패스 88296'/%3E%3Cpath d='M14.195 150.482c-1.457-4.367-4.437-6.835-7.318-6.439l1.256 6.677-1.981.373-1.261-6.7-2.76.519-.457-2.43 2.76-.519-1.257-6.676 1.981-.373 1.252 6.652c2.828-.678 4.707-4.061 4.477-8.659l2.13.552c.11 3.692-1 6.881-3.144 8.726 2.673.962 4.865 3.53 6.107 7.008Zm2.26-19.526 1.982-.373 3.631 19.3-1.98.372-1.588-8.424-4.529.853-.457-2.43 4.529-.853Z' data-name='패스 88297'/%3E%3Cpath d='m7.822 111.321-.236 14.9L0 126.106l.235-14.762 1.992.033-.2 12.312 3.6.058.2-12.457Zm1.836-2.228 2.04.034-.311 19.585-2.04-.033Zm7.547 2.522c2.52.04 3.916 2.871 3.842 7.527-.074 4.632-1.559 7.442-4.08 7.4-2.5-.039-3.891-2.895-3.817-7.528.074-4.656 1.559-7.441 4.055-7.4m-.04 2.5c-1.32-.021-2.069 1.768-2.119 4.936s.641 4.956 1.962 4.977c1.344.021 2.068-1.744 2.119-4.912s-.617-4.98-1.962-5' data-name='패스 88298'/%3E%3Cpath d='M15.91 81.425c-1.541 3.305-4.1 5.645-6.892 6.322 2.042 2.031 2.951 5.41 2.519 9.031l-2.179.377c.609-4.419-1.072-8.243-3.819-9.025l-1.108-.316.717-2.514 1.108.317c2.7.769 6.2-1.628 8-5.659Zm4.4-.62-2.361 8.288 7.365 2.1-.678 2.378-7.364-2.1-2.328 8.172L13 99.091l5.367-18.839Z' data-name='패스 88299'/%3E%3Cpath d='m18.43 62.229-5.912 11.346-1.747-.91 2.386-4.577-1.979-1.031 1.142-2.192L14.3 65.9l2.385-4.576ZM23.3 72c-1.443 2.767-3.835 3.929-5.921 2.842-2.108-1.1-2.525-3.725-1.082-6.492s3.834-3.93 5.941-2.831C24.326 66.6 24.744 69.228 23.3 72m1.787-14.389-1.42 2.725 5.065 2.64-1.142 2.193L15.566 58.9l1.143-2.2 5.15 2.684 1.42-2.724ZM21.62 71.119c.8-1.534.661-2.931-.468-3.519-1.148-.6-2.373.089-3.172 1.621s-.65 2.909.5 3.509c1.128.588 2.342-.079 3.141-1.611m1.461 4.981 6.59-12.644 6.258 3.264-1.143 2.193-4.487-2.341-5.45 10.452Z' data-name='패스 88300'/%3E%3Cpath d='M33.573 44.434c2.385 1.938 2.5 5.185.425 7.737-2.088 2.572-5.291 3.124-7.676 1.187s-2.5-5.185-.41-7.756c2.074-2.553 5.276-3.1 7.661-1.168m-5.722 7.042a3.071 3.071 0 0 0 4.526-.622 3.128 3.128 0 1 0-4.844-3.936 3.074 3.074 0 0 0 .318 4.558m4.464-15.734 9.949 8.083-1.559 1.919-9.949-8.083Zm10.806 8.779 6.037 4.9-1.558 1.923-4.472-3.633-7.658 9.427-1.57-1.271Z' data-name='패스 88301'/%3E%3Cpath d='m50.347 25.069-10.131 8.315-1.248-1.521 4.12-3.381-1.477-1.8 1.91-1.568L45 26.913l4.1-3.366Zm.433 10.856c-2.487 2.04-5.113 2.208-6.6.39s-.816-4.362 1.67-6.4 5.114-2.209 6.606-.39.815 4.361-1.671 6.4m-1.173-1.43c1.41-1.157 1.832-2.5 1.025-3.48s-2.2-.831-3.612.326-1.832 2.5-1.026 3.482 2.2.831 3.613-.328m-.392 4.516 10.965-9 4.6 5.6-10.966 9Zm1.96-19.966 8.329 10.15-1.909 1.568-8.33-10.149Zm3.258 22.51 7.218-5.924-2.117-2.579-7.217 5.924Z' data-name='패스 88302'/%3E%3Cpath d='M67.523 22.7c-3.094-6.021-1.526-9.9 1.59-11.5a5.93 5.93 0 0 1 4.795-.332l-.576 2.185a3.784 3.784 0 0 0-3.07.121c-1.985 1.02-2.881 3.37-.684 7.908a5.342 5.342 0 0 1 2.472-3.592c2.626-1.351 5.219-.713 6.842 2.447a5.285 5.285 0 0 1-2.139 7.387c-2.99 1.536-6.64.418-9.23-4.62m3.051.159c1.715 2.707 3.527 3.449 5.191 2.594 1.368-.7 1.864-2.415.866-4.359-.966-1.877-2.444-2.44-4.108-1.585a4.12 4.12 0 0 0-1.949 3.35' data-name='패스 88303'/%3E%3Cpath d='m85.201 14.756 6.006-2.015.648 1.934-6.005 2.015z' data-name='사각형 681'/%3E%3Cpath d='M100 16.68c4.023-5.6 6.431-9.131 5.972-11.78a2.8 2.8 0 0 0-3.491-2.562 4.8 4.8 0 0 0-3.093 2.534l-1.8-1.246A6.931 6.931 0 0 1 102.438.1a4.94 4.94 0 0 1 6.136 4.2c.538 3.1-1.734 6.709-4.7 11.121a29.233 29.233 0 0 1 2.81-.658l4.425-.763.4 2.319-11.235 1.949Z' data-name='패스 88304'/%3E%3Cpath d='M133.576 5.9a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88305'/%3E%3Cpath d='M24.884 171.231a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88306'/%3E%3Cpath d='M220.5 184.366a2.328 2.328 0 1 1-2.328-2.328 2.328 2.328 0 0 1 2.328 2.328' data-name='패스 88307'/%3E%3C/g%3E%3C/svg%3E");}
.mainPage .header.on .cursorbox { opacity:1;  transition: opacity .3s, z-index .3s .3s;}
.mainPage.opList .header .cursorbox { z-index: -1; opacity:0; pointer-events:none; transition: opacity .3s, z-index .3s;}
@keyframes intro_circle_ani {100% { transform: rotate(360deg);}}

.mainPage .header .info { opacity: 0; padding: 3px 4px; font-size:0; position:Absolute; top:650px; right:0px; cursor: pointer;}
.mainPage .header .info span { display:inline-block; width:23px; height:23px; border-radius:100%; border:2px solid #fff; text-align:center; }
.mainPage .header .info span::before { content:'?'; color:#fff; font-size:14px; line-height:22px; font-family:'GmarketB'; }
.dv_pc .mainPage .header .info:hover span { animation: blankinfo .3s cubic-bezier(.53,0,.58,1.46); }
.mainPage .header .infotxt { opacity: 0;width:100%; font-size:15px; line-height:28px; letter-spacing: -0.075em; text-align:center; font-family: 'GmarketL'; position:Absolute; top:720px; left:0px; transition: all .5s 1.6s;}
.mainPage .header .infotxt .chulBtn { display:inline-block; margin-top:-2px; margin-left: 6px; width:56px; height:20px; font-size: 12px; color: var(--main-color); line-height:22px; border-radius:3px; background: #fff; font-family: 'GmarketM'; vertical-align:middle; cursor: pointer; }
.mainPage .header .stop_sound { display:inline-block; opacity:0; width:26px; height:22px; position:absolute; top:654px; right:94px; z-index:10; cursor: pointer; background: url('../images/sound_off.png') no-repeat center; transition: opacity .5s 2s;}
.mainPage .header .stop_sound.off { background: url('../images/sound_on.png') no-repeat center;}
.mainPage .header.on .info { opacity:1; right: 50px; transition: all .5s .5s;}
.mainPage .header.on .infotxt { opacity:.5; top:690px; transition: opacity .3s, z-index .3s .3s;}
.mainPage .header.on .stop_sound { opacity: 1; transition: opacity .3s .5s;}
.mainPage.opList .header .info,
.mainPage.opList .header .infotxt { z-index: -1; opacity:0; pointer-events:none; transition: opacity .3s, z-index .3s; }
.mainPage.opList .header .stop_sound {opacity:0; pointer-events:none; transition: opacity .3s; }
.mainPage.icp .header .leftbox p .ichim { width:28px;}
.mainPage.icp .header .leftbox .ichim { text-indent: 0;width:39px; transition: all .3s ease-out;}
.mainPage.icp .header .topmenu .top_left_menu li .ichim {text-indent: -28px;width:0px; transition: all .3s ease-out;}
.mainPage.icp .header .infotxt .chulBtn { color: var(--main2-color); }
.main .mainPage .header .leftbox h1:after,
.main .mainPage .header .leftbox li:after,
.main .mainPage .header .leftbox p:after,
.main .mainPage .header .top_left_menu li:after,
.main .mainPage .header .top_right_menu .classbtn:after,
.main .mainPage .header .top_right_save:after {background: var(--main-color);}
.main2 .mainPage .header .leftbox h1:after,
.main2 .mainPage .header .leftbox li:after,
.main2 .mainPage .header .leftbox p:after,
.main2 .mainPage .header .top_left_menu li:after,
.main2 .mainPage .header .top_right_menu .classbtn:after,
.main2 .mainPage .header .top_right_save:after {background: var(--main2-color);}
@keyframes blankinfo {50% {transform: scale(1.2)}100% {transform: scale(1)}}

.mainPage.lesson_1 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num1.png');}
.mainPage.lesson_2 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num2.png');}
.mainPage.lesson_3 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num3.png');}
.mainPage.lesson_4 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num4.png');}
.mainPage.lesson_5 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num5.png');}
.mainPage.lesson_6 .header .cursorbox .roundC .circle_num {background-image: url('../images/circle_num6.png');}

.mainPage .header .leftbox h2 { height:232px; }

.mainPage.lesson_1 .header .leftbox p .pgn { width:66px; }
.mainPage.lesson_1 .header .leftbox p .aln { width:60px; }
.mainPage.lesson_2 .header .leftbox p .pgn { width:76px; }
.mainPage.lesson_2 .header .leftbox p .aln { width:60px; }
.mainPage.lesson_3 .header .leftbox p .pgn { width:76px; }
.mainPage.lesson_3 .header .leftbox p .aln { width:60px; }
.mainPage.lesson_4 .header .leftbox p .pgn { width:83px; }
.mainPage.lesson_4 .header .leftbox p .aln { width:61px; }
.mainPage.lesson_5 .header .leftbox p .pgn { width:88px; }
.mainPage.lesson_5 .header .leftbox p .aln { width:60px; }
.mainPage.lesson_6 .header .leftbox p .pgn { width:89px; }
.mainPage.lesson_6 .header .leftbox p .aln { width:55px; }

.mainPage .header .leftbox .numinfo.off { display:none; }
.mainPage.icp.lesson_1 .header .leftbox p .pgn { width:64px; }
.mainPage.icp.lesson_4 .header .leftbox p .pgn { width:75px; }
.mainPage.icp.lesson_5 .header .leftbox p .pgn { width:73px; }
.mainPage.icp.lesson_6 .header .leftbox p .pgn { width:84px; }
.mainPage .pageList .case .box{display: none;}
.mainPage .pageList .case .box.on{display: block;}

/* main pageSlide */
.mainPage .pageSlide { width:100%; height:100%; position:relative; z-index:-1; opacity:0; pointer-events:none; background: var(--main-color); transition:z-index .3s .3s; overflow: hidden;}
.mainPage .pageSlide .slide { width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1; opacity:0; pointer-events:none; transition: opacity .3s, z-index .3s .3s, filter .3s; transform: scale(1.3);}
.mainPage .pageSlide .slide.on { z-index:1; opacity:1; pointer-events:auto; transform: scale(1); transition: opacity .3s, z-index .3s, transform .3s;}
.mainPage .pageSlide .slide.off{transform: scale(0.7); transition: opacity .3s, z-index .3s .3s, filter .3s, transform .3s;}
.mainPage .pageSlide .bgmov { width:100%; height:100%; position:absolute; top:0; left:0; transition: opacity .3s, z-index .3s .3s; display:flex;align-items:center; justify-content:center;}
.mainPage .pageSlide .bgmov.ichim {z-index:-1; opacity:0; pointer-events:none;}
.mainPage .pageSlide .bgmov video { transition:transform .3s; width:100%; height:100%;}
.mainPage .pageSlide:after { content:''; display:inline-block; opacity:0; width:1276px; height:716px; position:Absolute; top:0; left:0; transition: all .3s; z-index:1; }
.mainPage .pageSlide.on { z-index:1; opacity:1; pointer-events:auto; transition:z-index .3s; }
.mainPage.opList .pageSlide .bgmov video { transform: scale(0.9); }
.mainPage.opList .pageSlide .slide{filter: blur(10px); transition: opacity .3s, z-index .3s .3s, filter .3s, transform .3s;}
.mainPage.opList .pageSlide:after { opacity:1;}
.mainPage.icp .pageSlide { background: var(--main2-color);}
.mainPage.icp .pageSlide .bgmov.ichim {z-index:1; opacity:1; pointer-events:auto; transition: opacity .3s, z-index .3s; }

/* main pageList */
.mainPage .pageList { width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1; opacity:0; background: rgba(0,0,0,0.3); pointer-events:none; transition: opacity .3s, z-index .0s .3s;}
.mainPage .pageList .pglist { padding-right: 76px; position:absolute; width:730px; height:100%; right:40px; }
.mainPage .pageList .in { height:100%; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none;}
.mainPage .pageList .in.lock{overflow: hidden; pointer-events: none;}
.mainPage .pageList .in::-webkit-scrollbar{ display:none; }
.mainPage .pageList ul { padding:102px 0; opacity: 0; transition: opacity .3s; pointer-events: none;}
.mainPage .pageList ul.on{opacity: 1; transition: none; pointer-events: auto;}
.mainPage .pageList ul.prev li{transform: translateY(-50px); opacity: 0;}
.mainPage .pageList ul.prev.on li{transform: translateY(0px); opacity: 1; transition-property: transform, opacity; transition-duration: .34s, .3s;}
.mainPage .pageList ul.prev.on li:nth-of-type(1){transition-delay: 1.32s, 1.36s;}
.mainPage .pageList ul.prev.on li:nth-of-type(2){transition-delay: 1.24s, 1.28s;}
.mainPage .pageList ul.prev.on li:nth-of-type(3){transition-delay: 1.16s, 1.2s;}
.mainPage .pageList ul.prev.on li:nth-of-type(4){transition-delay: 1.08s, 1.12s;}
.mainPage .pageList ul.prev.on li:nth-of-type(5){transition-delay: 1s, 1.04s;}
.mainPage .pageList ul.prev.on li:nth-of-type(6){transition-delay: .92s, .96s;}
.mainPage .pageList ul.prev.on li:nth-of-type(7){transition-delay: .84s, .88s;}
.mainPage .pageList ul.prev.on li:nth-of-type(8){transition-delay: .76s, .8s;}
.mainPage .pageList ul.prev.on li:nth-of-type(9){transition-delay: .68s, .72s;}
.mainPage .pageList ul.prev.on li:nth-of-type(10){transition-delay: .6s, .64s;}
.mainPage .pageList ul.prev.on li:nth-of-type(11){transition-delay: .52s, .56s;}
.mainPage .pageList ul.prev.on li:nth-of-type(12){transition-delay: .44s, .48s;}
.mainPage .pageList ul.prev.on li:nth-of-type(13){transition-delay: .36s, .4s;}
.mainPage .pageList ul.next li{transform: translateY(50px); opacity: 0;}
.mainPage .pageList ul.next.on li{transform: translateY(0px); opacity: 1; transition-property: transform, opacity; transition-duration: .34s, .3s; transition-timing-function: ease-in-out;}
.mainPage .pageList ul.next.on li:nth-of-type(1){transition-delay: .6s, .64s;}
.mainPage .pageList ul.next.on li:nth-of-type(2){transition-delay: .68s, .72s;}
.mainPage .pageList ul.next.on li:nth-of-type(3){transition-delay: .76s, .8s;}
.mainPage .pageList ul.next.on li:nth-of-type(4){transition-delay: .84s, .88s;}
.mainPage .pageList ul.next.on li:nth-of-type(5){transition-delay: .92s, .96s;}
.mainPage .pageList ul.next.on li:nth-of-type(6){transition-delay: 1s, 1.04s;}
.mainPage .pageList ul.next.on li:nth-of-type(7){transition-delay: 1.08s, 1.12s;}
.mainPage .pageList ul.next.on li:nth-of-type(8){transition-delay: 1.16s, 1.2s;}
.mainPage .pageList ul.next.on li:nth-of-type(9){transition-delay: 1.24s, 1.28s;}
.mainPage .pageList ul.next.on li:nth-of-type(10){transition-delay: 1.32s, 1.36s;}
.mainPage .pageList ul.next.on li:nth-of-type(11){transition-delay: 1.4s, 1.44s;}
.mainPage .pageList ul.next.on li:nth-of-type(12){transition-delay: 1.48s, 1.52s;}
.mainPage .pageList ul.next.on li:nth-of-type(13){transition-delay: 1.56s, 1.6s;}
.mainPage .pageList li { padding-left: 85px; font-size:46px; line-height:70px; letter-spacing:-0.025em; font-family: 'PretendardB'; position:relative; white-space:nowrap; }
.mainPage .pageList li > span { display:inline-block; opacity: .2; padding-right:1px; height:20px; font-size: 16px; line-height:20px; letter-spacing:0; text-align:right; font-family: 'PretendardSB'; position:absolute; top:14px; right:590px; overflow:hidden;}
.mainPage .pageList li > span em { display:block; position:relative; top:0; transition: top .3s; }
.mainPage .pageList li p { display:inline-block; opacity: .2; cursor: pointer; }
.mainPage .pageList li p:hover,
.mainPage .pageList li p:hover + span {opacity: 1; transition: opacity .3s;}
.mainPage .pageList li.long {-webkit-mask-image: linear-gradient(to right,black 98%, transparent); mask-image: linear-gradient(to right, black 98%, transparent);}
.mainPage .pageList li.long p {overflow: hidden; vertical-align: top;}
.mainPage .pageList li.long p em {position: relative; display: inline-block; padding-right: 20px; pointer-events: none;}
.mainPage .pageList li.long p > span {position: relative; display: inline-block; overflow: hidden; vertical-align: top; pointer-events: none;}
.mainPage .pageList li.long p:hover > span {animation: long_text 7s linear infinite;}
.mainPage .pageList .pglist_close { width:30px; height:30px; position:absolute; top:110px; right:38px; background: url('../images/pageList_pglist_close.png') no-repeat center; cursor: pointer;}
.dv_pc .mainPage .pageList .pglist_close:hover { transform: rotate(180deg); transition: transform .3s;}
.mainPage .pageList .arwC {display:inline-block; width:30px; height:30px; border-radius:100%; background: #000 url('../images/pageList_arwC.png') no-repeat center; position:absolute; top:0; right:0; opacity: 0; pointer-events: none; transform: translateX(-50px); transition: opacity .3s, transform .3s;}
.mainPage .pageList .arwC.on{opacity: 1; transform: translateX(0); transition: opacity .5s, transform .5s;}
.mainPage.smt .pageList li > span em { top:-20px;}
.mainPage.opList .pageList {z-index:2; opacity:1; pointer-events:auto; transition: opacity .3s, z-index .0s;}
@keyframes long_text {0% { left: 0; }100% { left: -50%; }}
.dv_mob	.mainPage .pageList .pglist .in > div{max-height: 1200px; overflow: hidden;}
.dv_mob .mainPage .pageList ul{height: 0px; overflow:hidden; padding: 0px;}
.dv_mob .mainPage .pageList ul.on{height: auto; padding: 102px 0;}
.mainPage .pageList li p .fBM { margin-top:-2px; }
.mainPage .pageList li p .fBM.adsup { margin-right:2px; padding-right:7px; position:relative; }
.mainPage .pageList li p .fBM.adsup sup { font-size:16px; line-height:46px; position:absolute; top:0; right:0; }



/*=========================================================================================================
* wordPage
=========================================================================================================*/
.wordPage { opacity:0; z-index:-1; pointer-events:none; width: 1280px; height: 720px; position:absolute; top:300px; left:0; transition:z-index .3s .3s, top .3s, opacity .2s;}
.wordPage.on { top:0; opacity:1; z-index:1; pointer-events:auto; transition:z-index .0s, top .3s .3s, opacity .3s .3s; }
.wordPage .header { width:100%; position:absolute; top:0; left:0; z-index:1;}
.wordPage .header h1 { padding-top: 35px; font-size:22px; color: #fff; line-height:34px; letter-spacing:-0.05em; text-align:center; font-family: 'PretendardEB';}
.wordPage .header h1 .ar { display:inline-block; margin: 11px 9px 0; width:6px; height:12px; vertical-align: top; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.936' height='23.043'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='m.707.707 10.814 10.814L.707 22.335' data-name='패스 85943'/%3E%3C/svg%3E") no-repeat center / contain;}
.wordPage .header .dwList { position:Absolute; top:40px; right:46px; z-index:1;}
.wordPage .header .dwList ul { font-size:0; position:Relative; z-index:1; }
.wordPage .header .dwList li { display:inline-block; padding: 0 4px; font-size:16px; line-height:26px; letter-spacing:-0.05em; font-family: 'PretendardEB'; white-space:nowrap; vertical-align:top;}
.wordPage .header .dwList li span {display:inline-block; width:50px; color: #fff; text-align:center; cursor: pointer; transition: color .3s;}
.wordPage .header .dwList li.over span {color: #FDC838; transition: color .3s .2s;}
.wordPage .header .dwList li.hidd { display:none;}
.wordPage .header .dwList li.hidd span { opacity: .3; cursor: default; }
.wordPage .header .dwList .bar { display:inline-block; width:50px; height:26px; background: #000; border-radius: 5px; position:absolute; left:0; top:0; transition: all .5s ease-in-out;}
.wordPage .homebtn { position:Absolute; top:42px; left:51px; font-size:0; cursor: pointer;}
.wordPage .homebtn span { display:inline-block; width:24px; height:20px; position:relative; }
.wordPage .homebtn svg {width:24px; height:20px; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); }
.wordPage .homebtn path { stroke-width:2px; fill:none; stroke:#fff;}
.dv_pc .wordPage .homebtn:hover svg { animation: homebtnAni 1s both;}
@keyframes homebtnAni { 0% { width:24px; height:20px;}30% {width:24.24px; height:18px;}40% {width:19.2px; height:22px;}50% {width:24px; height:18px;}65% {width:22.8px; height:20px;}75% {width:24.24px; height:19px;}100% {width:24px; height:20px;}}

.wordPage .openmenu { position:Absolute; top:42px; left:51px; font-size:0; cursor: pointer; z-index:1;}
.wordPage .openmenu span { display:inline-block; width: 24px; height: 22px; }
.wordPage .openmenu path {fill: none;stroke: #000;stroke-width: 2;--length: 22; stroke-dasharray: var(--length) var(--total-length);stroke-dashoffset: var(--offset);transition: all .3s cubic-bezier(.645, .045, .355, 1);}
.wordPage .openmenu .line--1 {--total-length: 20;--offset: -13;}
.wordPage .openmenu .line--3 {--total-length: 20;--offset: -8;}
.wordPage .openmenu .line--2 {--total-length: 3;--offset: -2; }
.wordPage .openmenu svg {-webkit-transform: rotate(180deg);transform: rotate(180deg); width:24px; height:22px;}
.dv_pc .wordPage .openmenu:hover svg path {transform: translateX(-2px); }
.dv_pc .wordPage .openmenu:hover svg .line--1 {--length: 10;--offset: 0;transform: rotate(-40deg) translateY(6px); transform-origin: left 11px;}
.dv_pc .wordPage .openmenu:hover svg .line--3 {--length: 10;--offset: 0;transform: rotate(40deg) translateY(-6px); transform-origin:left 11px;}
.dv_pc .wordPage .openmenu:hover svg .line--2 {--offset: 0;}
.wordPage .openmenu,
.dv_pc .wordPage .openmenu:hover {-moz-transition: all .1s ease-out;-o-transition: all .1s ease-out;-ms-transition: all .1s ease-out;transition: all .1s ease-out;}

.wordPage .cardListBox {position:relative; width: 100%; height:100%;}
.wordPage .cardListBox .swiper{overflow: hidden; height: 100%;  padding-top:130px; padding-left:30px;}
.wordPage .cardListBox .swiper-wrapper{white-space: nowrap; font-size: 0; transition: .3s;}
.wordPage .cardListBox .swiper-slide{position: relative; display: inline-block; margin-left: 20px; cursor: pointer; vertical-align:top; }
.wordPage .cardListBox .swiper-slide:first-child{padding-right: 50px;}
.wordPage .cardListBox .swiper-slide .listCard{position: relative; display: inline-block; width: 300px; height: 400px; border-radius: 30px; background-color: #fffefd; overflow: hidden; transition: .3s; transform: scale(1); z-index: 1;}
.wordPage .cardListBox .swiper-slide .wordName{font-family: 'NotoSBNb', 'PretendardEB'; font-size: 30px; color: #fff; margin-top: 13px; letter-spacing: -0.025em; user-select: none; padding-left: 20px; text-align: left;}
.wordPage .cardListBox .swiper-slide .wordName:has(.fBM){margin-top: 4px;}
/* .wordPage .cardListBox .swiper-slide .wordName::before{ content:'1'; font-size:0; } */
.wordPage .cardListBox .swiper-slide .wordName .numDan{position: relative; padding-left: 22px;}
.wordPage .cardListBox .swiper-slide .wordName .numDan .num{position: absolute; left: 0; top: 0;}
.wordPage .cardListBox .swiper-slide .wordName .fBM{margin-top: 5px;}
.wordPage .cardListBox .swiper-slide .wordName .fBM sup{font-size: 16px;}
.wordPage .cardListBox .swiper-slide .page{font-family: 'PretendardM'; font-size: 16px; color: #fff; margin-top: 7px; letter-spacing: -0.025em; user-select: none; padding-left: 20px; text-align: left;}




.wordPage .cardListBox .swiper-slide .listCard video{width: 100%; opacity: 0;}
.wordPage .cardListBox .swiper-slide .listCard .vdobox{text-align: center;}
.wordPage .cardListBox .swiper-slide.over{z-index: 1;}
.wordPage .cardListBox .swiper-slide.over .listCard {box-shadow: 60px 60px 100px rgba(105, 53, 0, 0.36); transform: scale(1.03);}
.wordPage .cardListBox .swiper-slide.over .listCard video{opacity: 1;}


/* wordPage detailWord popup */
.wordPage .detailWord { width:100%; height:100%; position:absolute; top:100%; left:0; background: #fff; opacity:0; z-index:-1; pointer-events:none; transition:z-index .3s .3s, top .3s, opacity .3s; }
.wordPage .detailWord.on { top:0; opacity:1; z-index:1; pointer-events:auto; transition:z-index .0s, top .3s .3s, opacity .3s .3s; }
.wordPage .detailWord > h2 { padding-top: 35px; width:100%; font-size:22px; color: #000; line-height:34px; letter-spacing:-0.05em; text-align:center; font-family: 'PretendardEB'; position:absolute; top:0; left:0;}
.wordPage .detailWord > h2 span { display:inline-block;  vertical-align: top; }
.wordPage .detailWord > h2 .ar { display:inline-block; margin: 10px 9px 0; width:7px; height:12px; vertical-align: top; background: url('../images/wordPage_detailWord_h2_ico.png') no-repeat center;}
.wordPage .detailWord > h2 .wdname strong { display:inline-block; height:26px; line-height:26px; position:relative; top:4px; overflow:hidden; vertical-align:top; white-space:nowrap;}
.wordPage .detailWord > h2 .wdname em {display:block; padding-right:1px; position:Relative; top:0px;}
.wordPage .detailWord > h2 .wdname strong { transition: width .3s;}
.wordPage .detailWord > h2.on .wdname em { top:-26px; transition: top .3s;}
.wordPage .detailWord .dtWordList { width:100%; height:26px; text-align:center; position:absolute; top:100px; left:0; z-index:1;}
.wordPage .detailWord .dtWordList .in { display:inline-block; position:relative; vertical-align:top;}
.wordPage .detailWord .dtWordList ul { display:inline-block; position:absolute; top:0; left:0; font-size:0; vertical-align:top; white-space:nowrap; opacity:0; z-index:-1; pointer-events:none;}
.wordPage .detailWord .dtWordList ul.on { opacity:1; z-index:1; pointer-events:auto;}
.wordPage .detailWord .dtWordList li { display:inline-block; padding: 0 13px; font-size:17px; line-height:26px; letter-spacing:-0.05em; font-family: 'NotoSSBNb', 'PretendardEB'; white-space:nowrap;}
.wordPage .detailWord .dtWordList li > span { display:inline-block; padding: 0 8px; color: rgba(0,0,0,.2); cursor: pointer; transition: color .3s;}
.wordPage .detailWord .dtWordList li.over span {color: #FDC838; transition: color .3s .2s;}
.wordPage .detailWord .dtWordList .bar { display:inline-block; width:100px; height:26px; background: #000; border-radius: 5px; position:absolute; left:0; top:0; transition: all .5s ease-in-out;}

.wordPage .detailWord .dtWordCnt { height:100%; padding: 127px 80px 80px; position:Relative;}
.wordPage .detailWord .dtWordCnt .in { position:relative; height:100%; }
.wordPage .detailWord .dtWordCnt .in > ul { width:100%; height: 100%; position:absolute; top:0; left:0; opacity:0; z-index:-1; pointer-events:none;}
.wordPage .detailWord .dtWordCnt .in > ul.on { opacity:1; z-index:0; pointer-events:auto;}
.wordPage .detailWord .dtWordCnt .in > ul > li { font-size: 0; xpadding-left:560px; width:100%; height:100%; position:absolute; top:0; left:0; opacity:0; z-index:-1; pointer-events:none;}
.wordPage .detailWord .dtWordCnt .in > ul > li.on {opacity:1; z-index:0; pointer-events:auto;}

.wordPage .detailWord .dtWordCnt .imgBox{position: relative; display: inline-flex; justify-content: center; align-items: center; width: 560px; height: 100%;}
.wordPage .detailWord .dtWordCnt .imgBox .imgCase{display: inline-block;}


.wordPage .detailWord .dtWordCnt .vdobox { position:absolute; top:50%; left:0px; transform: translateY(-50%);}
.wordPage .detailWord .dtWordCnt .vdobox video { width:440px; height:330px; }
.wordPage .detailWord .dtWordCnt .txtbox {display: inline-block; padding-right:55px; margin-top:88px; color: #000; width: 560px; vertical-align: top; }
.wordPage .detailWord .dtWordCnt .txtbox .bigtit { line-height:52px; font-family: 'PretendardBk'; }
.wordPage .detailWord .dtWordCnt .txtbox .bigtit .smt { display:block; font-size:16px; line-height:34px; letter-spacing:-0.05em; font-family: 'PretendardSB'; }
.wordPage .detailWord .dtWordCnt .txtbox .bigtit p {font-size:50px; font-family: 'NotoSBNb', 'PretendardEB'; margin-top: 6px;}
.wordPage .detailWord .dtWordCnt .txtbox .bigtit p .fBM sup{font-size: 30px; font-family: 'NotoSSBNb';}
.wordPage .detailWord .dtWordCnt .txtbox .bigtit p .fBM{margin-top: -17px;}


.wordPage .detailWord .dtWordCnt .txtbox .extxt { margin-top:14px; font-size:27px; line-height:40px; font-family: 'NotoSSBNb', 'PretendardSB'; text-align:justify;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt p + p{margin-top: 15px;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .fc { color: #ff6000;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .mint{color: #54CBB1;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .yl{color: #FDC838;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .myungjo{font-family: 'NotoSSB';}
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(1) .extxt p {letter-spacing: -0.025em;}
.wordPage .detailWord .dtWordCnt .txtbox .exlist { margin-top:30px; }
.wordPage .detailWord .dtWordCnt .txtbox .exlist li { margin-top:10px; padding-left: 34px; font-size:24px; color: #4a2200; line-height:40px; letter-spacing: -0.035em; text-align:justify; font-family: 'PretendardR'; position:relative;}
.wordPage .detailWord .dtWordCnt .txtbox .exlist li:first-child { margin-top:0;}
.wordPage .detailWord .dtWordCnt .txtbox .exlist li .num { display:inline-block; width:24px; height:24px; font-size:12px; color: #fff4e8; letter-spacing:-0.05em; line-height:24px; font-family: 'PretendardSB'; text-align:center; background: #4a2200; border-radius:100%; position:Absolute; top:7px; left:0;}
.wordPage .detailWord .dtWordCnt .txtbox .bigtit.dan p{margin-top: 12px;}
.wordPage .detailWord .dtWordCnt .txtbox .bigtit.dan + .extxt{margin-top: 20px;}


.wordPage .detailWord .dtWordCnt .vdoCtr { margin-left: -39px; padding: 9px 0; width:78px; height: 40px; text-align:center; border-radius:40px; border:1px solid rgba(74,34,0,0.2); position:absolute; bottom:40px; left:50%; }
.wordPage .detailWord .dtWordCnt .vdoCtr.hide{display: none;}
.wordPage .detailWord .dtWordCnt .vdoCtr span { display:inline-block; margin: 0 4px; padding: 10px; cursor: pointer; background-repeat: no-repeat; background-position: center; position:relative;backface-visibility: hidden;-webkit-appearance: none; -webkit-tap-highlight-color: transparent;	transform: translateY(var(--y, 0)) translateZ(0); }
.wordPage .detailWord .dtWordCnt .vdoCtr span:active {--y: 1px;}
.wordPage .detailWord .dtWordCnt .vdoCtr span:not(.stop):before,
.wordPage .detailWord .dtWordCnt .vdoCtr span:not(.stop):after {content: '';background: #4a2200;width: var(--width, 16px);height: 12px;position: absolute;left: 5px;top: 4px;backface-visibility: hidden;transform-origin: 50% 100%; transform: translateX(var(--x, 0)) translateZ(0);-webkit-clip-path: polygon(0 0, 3px 0, 3px 12px, 0 12px);clip-path: polygon(0 0, 3px 0, 3px 12px, 0 12px);transition: clip-path .6s ease;}
.wordPage .detailWord .dtWordCnt .vdoCtr span:not(.stop):after {--width: 3px;--x: 6px;}
.wordPage .detailWord .dtWordCnt .vdoCtr span.play:before {-webkit-clip-path: polygon(0 0, 11px 6px, 11px 6px, 0 12px);clip-path: polygon(0 0, 11px 6px, 11px 6px, 0 12px);transition-delay: .9s;}
.wordPage .detailWord .dtWordCnt .vdoCtr span.play:after {animation: to-play .9s ease forwards; }
.wordPage .detailWord .dtWordCnt .vdoCtr span.pause:before {-webkit-clip-path: polygon(0 0, 3px 0, 3px 12px, 0 12px);clip-path: polygon(0 0, 3px 0, 3px 12px, 0 12px);transition-delay: 0s;}
.wordPage .detailWord .dtWordCnt .vdoCtr span.pause:after {animation: to-pause 1.3s ease forwards;}
.wordPage .detailWord .dtWordCnt .vdoCtr span.stop { background-image: url('../images/wordPage_detailWord_vdoCtr_stop.png');}
.wordPage .detailWord .dtWordCnt .cha { opacity:0; width:143px; height:152px; background: url('../images/wordPage_detailWord_cha.png') no-repeat center / contain; position:absolute; right: 0; bottom: 50px; transition: all .3s .3s ease-in-out;}
.wordPage .detailWord.on .dtWordCnt .cha { opacity:1; right: 50px; transition: right .5s .4s, opacity .5s .6s;}

.wordPage .detailWord .dtwClose { padding: 11px; position:Absolute; top:34px; right:40px; cursor: pointer; transition: transform .2s; }
.wordPage .detailWord .dtwClose span { display:inline-block; width:17px; height:17px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33.941' height='33.942'%3E%3Cg fill='none' stroke='%23000' stroke-width='4'%3E%3Cpath d='M1.415 32.528 32.528 1.415' data-name='선 610'/%3E%3Cpath d='m1.415 1.414 31.113 31.113' data-name='선 611'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain; }
/* .wordPage .detailWord .dtwClose:hover span { transform: rotate(360deg); transition: transform .5s cubic-bezier(.17,.67,.7,1.55);} */

.wordPage .detailWord .btnarea { width:120px; height:620px; position:Absolute; bottom:0; }
.wordPage .detailWord .btnarea span { display:inline-block; width:60px; height:60px; text-align:center; position:absolute; cursor: pointer; pointer-events:none;}
.wordPage .detailWord .btnarea span:before {content:''; display:inline-block; opacity:0; width:0; height:0; background: #000; border-radius:100%; margin: 25px 0 0 25px; transition: all .2s;}
.wordPage .detailWord .btnarea span:after { content:''; display:inline-block; opacity:0; margin: -8px 0 0 -12px; width: 12px; height:7px; background: url("../images/wordPage_detailWord_btnarea_arr.png") no-repeat center; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50.686' height='30.543'%3E%3Cg fill='none' stroke='%23fff' stroke-width='4' data-name='그룹 351'%3E%3Cpath d='m34 1.414 13.857 13.857L34 29.128' data-name='패스 85944'/%3E%3Cpath d='M0 15.414h46' data-name='선 612'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain; position:Absolute; top:50%; left:50%; transform: rotate(360deg); transition: all .2s;}
.wordPage .detailWord .btnarea.prev { left:0; }
.wordPage .detailWord .btnarea.prev span:after { transform: rotate(180deg);}
.wordPage .detailWord .btnarea.next { right:0; }
.dv_pc .wordPage .detailWord .btnarea.off{display: none;}
.dv_pc .wordPage .detailWord .btnarea:hover span { pointer-events:auto; }
.dv_pc .wordPage .detailWord .btnarea:hover span:before {opacity:1; width: 100%; height: 100%; margin: 0; transition: all .2s cubic-bezier(.17,.67,.7,1.55); }
.dv_pc .wordPage .detailWord .btnarea:hover span:after {opacity:1; width: 25px; height: 15px; transition: all .2s .2s cubic-bezier(.17,.67,.7,1.55); }
.dv_mob .wordPage .detailWord .btnarea { opacity:1; transition: opacity .3s; }
.dv_mob .wordPage .detailWord .btnarea.off{ pointer-events:none; opacity:0; transition: opacity .1s; }
.dv_mob .wordPage .detailWord .btnarea span { pointer-events:auto; top:50%; margin-top:-90px;}
.dv_mob .wordPage .detailWord .btnarea span:before {opacity:1; width: 50px; height: 50px; margin: 0; }
.dv_mob .wordPage .detailWord .btnarea span:after {opacity:1; width: 16px; height: 12px;  margin-top:-11px; margin-left:-8px; }
.dv_mob .wordPage .detailWord .btnarea.prev span { left:20px;}
.dv_mob .wordPage .detailWord .btnarea.next span { right:20px;}

.wordPage .detailWord .dtwc_1 li:nth-child(1) .imgBox .swiper-slide:nth-of-type(1) .imgCase{margin-right: 40px;}
.wordPage .detailWord .dtwc_1 li:nth-child(2) .imgBox .swiper-slide:nth-of-type(1) .imgCase{margin-right: 70px;}
.wordPage .detailWord .dtwc_1 li:nth-child(3) .imgBox .swiper-slide:nth-of-type(1) .imgCase{margin-right: 70px;}


/*=========================================================================================================
* contents menu, frac, swiper
=========================================================================================================*/

.wordPage .menu { opacity:0; padding:92px 0 0 48px; width:360px; background:rgba(0,0,0,0.7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); position:absolute; top:0; left:-320px; z-index:-1; transition:z-index .3s .3s, left .3s, opacity .3s; }
.wordPage .menu { width:460px; } /*이 단원만 width 늘리기*/
/* .wordPage .menu::before { content:''; opacity:0; display:inline-block; width:310px; height:100px; background:linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 90%, transparent); position:absolute; top:0; left:0; } */
/* .wordPage .menu::after { content:''; display:inline-block; width:308px; height:3px; background:#c8b5a2; position:absolute; bottom:0; left:0; } */
.wordPage .menu.on { opacity:1; left:0; z-index:1; transition:z-index .0s, left .3s .3s, opacity .3s .3s; }
.wordPage .menu.on::before { opacity:1; }
.wordPage .menu .menuClose { padding:11px; position:absolute; top:32px; left:41px; cursor:pointer; }
.wordPage .menu .menuClose span { display:inline-block; width:18px; height:18px; background:url('../images/wordPage_detailWord_menuClose.png') no-repeat center; }
.wordPage .menu .menuList { padding-bottom:30px; height:628px; overflow-y:auto; }
.wordPage .menu .menuList::-webkit-scrollbar { width:2px; }
.wordPage .menu .menuList::-webkit-scrollbar-thumb { background:#4a2200; }
.wordPage .menu .menuList::-webkit-scrollbar-track { background:transparent; }
.wordPage .menu .menuList li { position:relative; }
.wordPage .menu .menuList li span { font-family: 'NotoSBNb', 'PretendardEB'; font-size:30px; line-height:40px; letter-spacing:-0.025em; color:#fff; cursor:pointer; user-select: none; }
.dv_pc .wordPage .menu .menuList li.over span { color:#FDC838; }
.dv_pc .wordPage .menu .menuList li.active span { cursor:default; }
.dv_mob .wordPage .menu .menuList li.active span { cursor:default; color:#FDC838; }
.wordPage .menu .menuList li.first { margin-top:54px; }
.wordPage .menu .menuList li.first:first-of-type { margin-top:42px; }
.wordPage .menu .menuList li.first::before { display:inline-block; font-family:'PretendardEB'; font-size:17px; line-height:20px; color:#fff; position:absolute; top:-29px; left:0; pointer-events:none; }
.wordPage .menu .menuList li[data-les="0"].first::before { content:'4단원'; }
.wordPage .menu .menuList li[data-les="1"].first::before { content:'5단원'; }
.wordPage .menu .menuList li[data-les="2"].first::before { content:'6단원'; }
.wordPage .menu .menuList .fBM sup{font-size: 16px; font-family: 'NotoSSBNb';}

.wordPage .detailWord .dtWordCnt .imgBox .swiper { width:100%; height: 100%; overflow-x:hidden; }
.wordPage .detailWord .dtWordCnt .imgBox .swiper-wrapper { height: 100%; white-space: nowrap;}
.wordPage .detailWord .dtWordCnt .imgBox .swiper .swiper-slide{display: inline-flex; justify-content: center; align-items: center; width: 100%; height: 100%; vertical-align: top;}
.wordPage .detailWord .dtWordCnt .imgBox .swiper .swiper-pagination { position:absolute; bottom: 36px; left:50%; transform:translateX(-50%); margin-left: -34px;}
.wordPage .detailWord .dtWordCnt .imgBox .swiper .swiper-pagination .bullet { display:inline-block; width:20px; height:20px; cursor:pointer; position:relative; }
.wordPage .detailWord .dtWordCnt .imgBox .swiper .swiper-pagination .bullet::after { content:''; display:inline-block; width:12px; height:12px; border:2px solid #C4C4C4; border-radius:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.wordPage .detailWord .dtWordCnt .imgBox .swiper .swiper-pagination .bullet.active::after { background:#000; border: 2px solid #000; }
.wordPage .detailWord .dtWordCnt .txtbox .extxt .fBM:has(sup){margin-top: -10px;}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .fBM sup { font-size: 16px; font-family: 'NotoSSBNb';}
.wordPage .detailWord .dtWordCnt .txtbox .extxt .frac { padding-top:28px; margin:-7px 5px 0; display:inline-block; font-size:24px; line-height:28px; font-family:'PretendardSB'; text-align:center; vertical-align:top; position:relative; }
.wordPage .detailWord .dtWordCnt .txtbox .extxt .frac::after { content:''; display:inline-block; width:16px; height:2px; background:#4a2200; position:absolute; top:27px; left:50%; transform:translateX(-50%); }
.wordPage .detailWord .dtWordCnt .txtbox .extxt .frac em { position:absolute; top:0; left:50%; transform:translateX(-50%); }
.wordPage .detailWord .dtWordCnt .txtbox .extxt .frac.ml_0 { margin-left:0; }

.wordPage .cardListBox .swiper-slide .wordName .atxt { position:absolute; top:0; left:13px; }
.wordPage .cardListBox .swiper-slide .wordName:has(.atxt) { position:relative; padding-left:92px; }
.wordPage .cardListBox .swiper-slide .wordName:has(.atxt.at2) { padding-left:114px; }
.wordPage .cardListBox .swiper-slide .wordName:has(.atxt.at3) { padding-left:134px; letter-spacing:-0.06em; }
.wordPage .cardListBox .swiper-slide .wordName .gulho { font-family: 'NotoSSB';  display: inline-block; margin-top: -7px; }
.wordPage .detailWord .dtWordList li .gulho { font-family: 'NotoSSB'; display: inline-block; margin-top: -1px; }
.wordPage .detailWord .dtWordCnt .txtbox .bigtit p .gulho { font-family: 'NotoSSB'; display: inline-block; margin-top: -7px; }
.wordPage .menu .menuList li span .gulho { font-family: 'NotoSSB'; display: inline-block; margin-top: -7px; }

.wordPage .cardListBox .swiper-slide .wordName .intxt { padding-left:102px; position:relative; }
.wordPage .cardListBox .swiper-slide .wordName .intxt > span { position:absolute; top:0; left:0; }
.wordPage .cardListBox .swiper-slide .wordName .block { display:block; }
.wordPage .cardListBox .swiper-slide .wordName .block.fir::after{ content:','; position:absolute; right:63px; }
.wordPage .cardListBox .swiper-slide .wordName .block:not(.fir) { margin-left:-96px; }

.wordPage .detailWord .dtWordList li > span .block.fir::after { content:', '; }
.wordPage .menu .menuList li span .block.fir::after { content:', '; }


.wordPage .detailWord .dtWordCnt .dtwc_0 li:nth-child(5) .extxt { letter-spacing: -0.01em; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt .gulho { font-family:'NotoSSB'; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt .gulho > em { font-family:'PretendardSB'; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt .giho { margin-top:-6px; display:inline-block; font-family:'BkMB'; vertical-align:middle; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt p { margin-top:0; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt p:nth-child(1) { letter-spacing: -0.07em; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt p:nth-child(2) { text-align:center; }
.wordPage .detailWord .dtWordCnt .dtwc_1 li:nth-child(2) .extxt p:nth-child(3) { letter-spacing:-0.01em; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(2) .txtbox .bigtit.dan p { letter-spacing:-0.035em; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(2) .extxt { letter-spacing:-0.045em; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(3) .extxt { letter-spacing: -0.035em; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(5) .txtbox .bigtit.dan p { margin-top:8px; line-height:60px; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(5) .extxt { letter-spacing: -0.05em; }
.wordPage .detailWord .dtWordCnt .dtwc_2 li:nth-child(6) .extxt { letter-spacing: -0.035em; }


.alertPop{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; opacity: 0; z-index: -1; pointer-events: none;}
.alertPop .inbox{border-radius: 60px; font-family: 'PretendardM'; background-color: rgba(0,0,0,0.7); font-size: 22px; text-align: center; padding: 20px 26px;}
.alertPop.on{opacity: 1; z-index: 1; transition: opacity .3s, z-index .3s;}




/*=========================================================================================================
* 진도저장
=========================================================================================================*/
.Progress{position:absolute;top:0;left:0;width:100%;height:100%;display:none;color:#111;font-family:"NotosansR",sans-serif;font-size:16px;z-index:30}
.Progress.On{display:block}
.Progress__Background{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:.6}
.Progress__Inner{position:fixed;margin: -273px 0 0 -283px; top:50%;left:50%;width:565px;height:545px;border-radius:4px;background-color:#fff}
.Progress__Line{width:515px;height:1px;margin:0 auto;background-color:#000;opacity:.15}
.Progress__Line.Light{opacity:.05}
.Progress__Title{height:68px;margin:0 auto;line-height:80px;font-family:"NanumSquareB",sans-serif;font-size:21px;text-align:center}
.Progress__Table{width:515px;margin:0 auto}
.Progress__Table__Row{height:50px;display:flex;align-items:stretch}
.Progress__Table__Cell{display:flex;align-items:center;justify-content:center}
.Progress__Table__Cell.Checkbox{flex:0 0 50px}
.Progress__Table__Cell.Class{flex:0 0 100px}
.Progress__Table__Cell.Page{flex:0 0 200px}
.Progress__Table__Cell.Page>*{cursor:pointer}
.Progress__Table__Cell.Date{flex:0 0 165px}
.Progress__Table__Body{height:356px;overflow:auto}
.Progress__Ordering{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);width:20px;height:20px;background:url('../images/ordering.svg') center/6px auto no-repeat;cursor:pointer}
.Progress__Ordering.Reversed{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}
.Progress__Textbook{width:52px;height:15px;margin-top:0;border-radius:2px;color:#fff;font-family:"NotoSansB",sans-serif;font-size:11px;text-align:center;line-height:15px}
.Progress__Textbook.Main{background-color:#121d84}
.Progress__Textbook.Main::before{content:"수학"}
.Progress__Textbook.Sub{background-color:#41aef3}
.Progress__Textbook.Sub::before{content:"수학익힘"}
.Progress__Checkbox{position:relative;box-sizing:border-box;width:16px;height:16px;border-radius:4px;border:1px solid #ccd6e7;background-color:#f3f6f9;cursor:pointer}
.Progress__Checkbox::before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);content:"";display:none;position:absolute;top:1px;left:4px;width:5px;height:8px;border-right:1px solid #5971a8;border-bottom:1px solid #5971a8}
.Progress__Checkbox.Selected::before{display:block}
.Progress__Page{width:38px;padding-left:8px}
.Progress__Bottom{position:relative}
.Progress__Button{box-sizing:border-box;position:absolute;top:15px;right:24px;width:70px;height:29px;border:1px solid #ccd6e7;border-radius:4px;background-color:#f3f6f9;color:#6e7b8e;font-family:"NanumSquareRoundB",sans-serif;font-size:12px;line-height:29px;text-align:center;cursor:pointer}
.Progress__Button.Big{right:auto;left:24px;width:120px}
.Progress__Close{position:absolute;top:33px;left:523px;width:16px;height:16px;background:url('../images/close.png') center/contain no-repeat;cursor:pointer}











































