/*============ Font+Global ============*/
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
@font-face {font-family: 'HoonJunglebookR';font-style: normal;font-weight: normal;src: url('../fonts/HoonJunglebookR.woff') format('woff');}
*{margin:0;padding:0;box-sizing: border-box;font-family: 'Nanum Gothic', 'HoonJunglebookR', sans-serif;font-weight: 400;list-style: none;}
html{font-size: 100%;}
body,button,p,div,input{font-size: 1rem;color: #4d4d4f;line-height:1.5;}
.qust u{text-underline-offset:.5rem;}.underline{border-bottom:2px solid;display:inline-block;width:4rem;}.mean{color:var(--color-primary);font-size:clamp(.55em, calc(1vw + 1vh + 0.5vmin), .75em);}
:root {
	/*----------- Colors -----------*/
	--color-text: #4d4d4f; /*기본텍스트*/
	--color-text-em: #414141; /*강조텍스트*/
	--color-border: #9d71a2; /*input border 색상*/
	--color-danger: #d2232a; /*주의!경고!색상*/
	--color-primary: #874f8e; /*로고타이틀 + 문제진행바+ 공통상단(레벨박스배경,라인)색상*/
	--color-primary-em: #7e3c84; /*서브타이틀 + 문제(지문) 강조색상*/
	--color-primary-bg: #73287b; /*배경(진한) + 제한/남은시간 박스 배경 + 종료화면->Level텍스트*/
	--color-primary-bg-light: #e8e0eb; /*배경(연한) + 제한/남은시간 텍스트 배경*/
	--color-primary-btn: #916298; /*버튼텍스트*/
	--color-qust-text: #7e3c84; /*서브타이틀 + 문제(지문) 강조색상*/
	--color-qust-bg: #f2edf3; /*배경(연한) 문제 배경*/
	--color-qust-border: #818286; /*input border 기본 + 문제입력*/
	--color-TY02-bg: #d7ece9;
	--color-TY02-bg-title: #65ada3;
	/*----------- layout size -----------*/
	--size-container-width: 90%;
	--size-container-min-width: 320px;
	--size-container-max-width: 1280px;
	--size-header-height: 140px;
	--size-footer-height: 110px;
	--size-main-height: calc(100vh - var(--size-header-height) - var(--size-footer-height) - var(--marigin-top) - 1px);
	--size-main-width: 90%;
	--marigin-top: 50px;
	/*----------- Transition -----------*/
	--tran-03: all 0.3s ease;
	--tran-04: all 0.4s ease;
}

/*============ Common + Controls ============*/
@media print {.noprint {display: none !important} .page-container{--size-container-width:100%} }
._debug{background: rgba(0, 0, 0, 0.1);} /*레이아웃 체크용*/
.none{display:none !important}
.hide{visibility:hidden !important}
.block{display: block !important;}
.iblock{display: inline-block !important;}
*[disabled]{cursor:not-allowed !important;opacity:0.5}
.em{font-weight:700;}
a{text-decoration: none;}
a.link{text-decoration:underline;color:var(--color-primary-em);transition:var(--tran-03);display:inline-block;}
a.link:hover, a.link:active{font-weight:bold;}
a.disabled{cursor:not-allowed !important;opacity:0.5}
h1.logo{font-family: 'HoonJunglebookR'; color: var(--color-primary);font-weight:100;position: relative;}
h2.title{font-family: 'HoonJunglebookR'; color: var(--color-primary);font-weight:100;position: relative;border-left: 3px solid var(--color-primary); border-right: 3px solid var(--color-primary);display: inline-block;padding: 0 15px;margin:20px;}
h2.level{font-family: 'HoonJunglebookR'; color: var(--color-primary-em);font-weight:100;font-size: 3em;display: inline-block;border-bottom: 2px solid var(--color-primary-em);margin: 20px;}
h3{font-weight: 700;}
.btn-radius{outline: none; border: 1px solid var(--color-primary-bg); border-radius: 10px;background:none;color:var(--color-primary-bg);padding: 3px 15px;cursor: pointer;transition: var(--tran-04);font-weight: bold;}
.btn-radius.active, .btn-radius:hover{background: var(--color-primary-bg); color: #fff;}
.center-flex{display: flex; align-items: center;justify-content: center;}
.center{text-align: center;margin:0 auto;}
.right{text-align: right;}
.left{text-align: left;}
.w100{width: 100% !important;}
.h100{height: 100% !important;}
.m-0{margin:0 !important;}
.m-5{margin: 5px;}
.m-10{margin: 10px;}
.m-20{margin: 20px;}
.m-30{margin: 30px;}
.m-40{margin: 40px;}
.m-t{margin-top:20px !important;}
.m-b-0{margin-bottom:0px !important;}
.m-b-20{margin-bottom:20px !important;}
.m-b-50{margin-bottom: 60px !important;}
.m-r-5{margin-right: 5px;}
.fix-top{margin-top: var(--marigin-top) !important;}
.font-hjb{font-family: 'HoonJunglebookR';font-weight: 100;}
.font-break{word-break: keep-all;}
.color-primary{color: var(--color-primary);}
.color-danger{color: var(--color-danger);}
strong{font-weight: 800;}
b{font-weight: 700;}
.btn{padding:0 30px 3px 10px;color: var(--color-primary-btn);display: inline-block;position: relative;margin-bottom: 10px;font-weight: 700;background:none;outline:none;border:none;font-size:1.2rem;}
.btn:not(:disabled){cursor:pointer !important;}
.btn::before{content: '';position: absolute;width:100%;height:2px; background: var(--color-border);bottom: 0;left: 0;}
.btn::after{content: '';width:20px;height:21px;background:url(../images/icon_pen_r.png) no-repeat;display: inline-block;position: absolute;bottom: 0;right:0;}
.btn.left{transform: scaleX(-1);}
.btn b{transform: scaleX(-1);display:inline-block;}
.btn:not(:disabled):hover::before{animation: anim-pencel-line 0.4s linear}
.btn:not(:disabled):hover::after{animation: anim-pencel 0.4s linear}
.btn.loading-text i::after{content:""; animation:anim-loading-text 4s infinite;width:1rem;display:inline-block;text-align:left;}
@keyframes anim-loading-text{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}100%{content:"...."}}
@keyframes anim-pencel-line{0%{width : 1%; opacity:0.1}70%{width : 100%; opacity:1}}
@keyframes anim-pencel{0%{right : 100%;}70%{right : 0;}80%{transform:rotate(6deg);}90%{transform:rotate(-6deg);}100%{transform:rotate(0);}}

.flex-between{display: flex;justify-content: space-between;align-items: center;}
.check-label{color: var(--color-primary-em);font-weight: 700;}
.check-label > input{transform: scale(1.5);outline:none}
.counter{width: 32px;height:34px;background:url(../images/icon_counter_m.png) no-repeat;position: relative;text-align:center;line-height: 35px;font-weight: 800;color: var(--color-primary-em);text-indent: 2px;display: inline-block;transition: var(--tran-04);background-size:cover;margin-bottom:10px;transform:scale(1.2);}
.counter.danger{background-image: url(../images/icon_counter2_m.png);color: var(--color-danger);}

.progress{width: 100%;height: 20px; border: 1px solid var(--color-primary);position: relative;border-radius: 8px;}
.progress .bar{width: 1%;position: relative;top:0;left:0;background:var(--color-primary);height: 100%;border-radius: 4px;border: none;transition: var(--tran-03);}
.progress .icon{position: absolute;top:-50px;right:-30px;background: url(../images/icon_num.png) no-repeat; width: 44px;height: 49px;color:#fff;text-align:center;line-height:49px;text-indent: -10px;z-index: -1;transition: var(--tran-04);background-size:cover;}
.progress .icon.active{animation: anim-prog-icon 0.5s both}
.progress .bar.max .icon{opacity: 0;}
.progress strong.qu-cnt{opacity: 0;transition: var(--tran-04);}
.progress strong.qu-cnt::after{content:" / ";}
.progress strong.qu-cnt.active{opacity: 1;}
@keyframes anim-prog-icon{0% {transform: scale3d(1, 1, 1);}30% {transform: scale3d(1.25, 0.75, 1);}40% {transform: scale3d(0.75, 1.25, 1);}50% {transform: scale3d(1.15, 0.85, 1);}65% {transform: scale3d(0.95, 1.05, 1);}75% {transform: scale3d(1.05, 0.95, 1);}100% {transform: scale3d(1, 1, 1);}}

table.table{width: 100%;border-bottom: 2px solid #1a1b1b;margin: 10px auto;border-collapse: collapse;}
table.table thead{background: var(--color-border);color:#fff;}
table.table th{font-weight: 700;border: 1px solid #fff;}
table.table th, td{padding: 15px;}
table.table td{border: 1px dashed rgba(26,27,27,0.5);border-left: none;}
table.table td:last-child{border-right: none;}
table.table th:first-child{border-radius: 10px 0 0 0;}
table.table th:last-child{border-radius: 0 10px 0 0 ;}
table.table tr.active{background:var(--color-primary-bg-light);color: var(--color-primary-em);}
table.table tr.active > td{font-weight: 800;}
/*============ Layout > Header ============*/
.page-container{min-width: var(--size-container-min-width);width: var(--size-container-width);max-width: var(--size-container-max-width); height:100vh;margin: 0 auto;}
.page-container header{height: var(--size-header-height);display: flex;flex-direction: column;justify-content: center;}
.page-container header .wrap{display: flex; justify-content: space-between;}
.page-container header .wrap.down{border-top: 1px solid var(--color-primary);padding-top: 10px;}
.page-container header .level-info{background: var(--color-primary);color: #fff;font-family: 'HoonJunglebookR';font-weight: 100;padding: 5px 10px;border-radius: 8px 8px 0 0;}
.page-container header .time-info ul{display: flex;align-items: center;background: var(--color-primary-bg-light);margin:0;border-radius: 12px;}
.page-container header .time-info li{padding: 5px 15px; text-align: center;background: var(--color-primary-bg-light);margin:0;border-radius: 0 12px 12px 0;}
.page-container header .time-info li.head{background: var(--color-primary-bg);color: #fff;border-radius:12px;}
.page-container header .time-info li:last-child{min-width:120px;}
.page-container header h1.logo::before{content: '';display: block;width: 100%;height: 3px;position: absolute;top:-12px;left: 0;background: var(--color-primary);}
/*============ Layout > Main ============*/
.main-container{display:flex;flex-direction:column;justify-content:center; width: var(--size-main-width);margin:auto;height:auto;min-height:calc(100vh - var(--size-header-height));}
.main-container main{display: flex;justify-content: center;align-items: center;margin: auto auto auto auto;width: 100%;height: auto;text-align: center;}
.main-container main > section{width: 100%;}
.main-container main .note{background: var(--color-qust-bg);padding: 15px;width: 100%;margin: 0 auto;border-radius: 5px;}
.main-container main .note ol{margin:0 30px;}
.main-container main .note li{list-style:decimal;text-align: left;margin-bottom: 20px;word-break: keep-all;}
.main-container main .note li:first-child{margin-top: 10px;}
.main-container main .note li:last-child{margin-bottom: 10px;}
.main-container main .note u{font-weight:bold;color:var(--color-danger);text-decoration:none;}

.main-container main .waiting{margin: 20px auto 40px;background: var(--color-danger);color:#fff;display: inline-block;padding: 5px 20px;border-radius: 12px;width:200px;}
.main-container main .waiting strong{font-size: 1.2rem; color:#fff !important}
/*============ Layout > Test ============*/
.main-container main .timer{color: var(--color-primary);margin: 20px auto;text-align: center;display:flex;justify-content: center;align-items: center;}
.main-container main .qust{min-height:calc(var(--size-main-height) - 150px);background: var(--color-qust-bg);padding:30px;border-radius:5px;display: flex;flex-direction: column;justify-content:space-around;align-items: center;}
.main-container main .qust h1{color:var(--color-qust-text);font-weight:700;margin: 0 auto 1rem;word-break: keep-all;text-align:center;font-size:clamp(1.2rem, calc(1vw + 1vh + 0.5vmin), 2rem);}
/*.main-container main .qust h2{color:var(--color-qust-text);font-weight:700;margin: 30px auto 60px;font-size:3rem;word-break: keep-all;text-align:center}*/
.main-container main .qust h2{color:var(--color-qust-text);font-weight:700;margin: 0 auto 0;word-break: keep-all;text-align:center;position:relative;font-size:clamp(1.6rem, calc(1vw + 2vh + 0.5vmin), 3rem);}
.main-container main .qust input{border: none;outline: none;background: none;border-bottom: 1px solid var(--color-qust-border);display: inline-block; width:80%; text-align: center;height:40px;font-size:2em;}
.main-container main .qust p.hint{margin:1rem auto;margin-left:2rem; font-size:.9rem;background:#fff;padding:.4rem 1rem;border-radius:2rem;position:relative;min-width:200px;display:inline-block;}
.main-container main .qust p.hint:before{content:'hint';display:block;position:absolute;top:50%;left:-2rem;transform:translateY(-50%); background:var(--color-primary-em);color:#fff;padding:.5rem;border-radius:.8rem;font-weight:bold;}
.main-container main .qust p.hint:after{content:'';display:block;width:10px;height:10px;background:var(--color-primary-em);position:absolute;top:50%;left:3px; transform:translateY(-50%) rotate(45deg);}
.main-container main .qust .link-audio{border:0; background:none;cursor:pointer;}
.main-container main .qust .info{display:block;background:#fff;border:1px solid var(--color-qust-border);border-radius:1rem;font-size:0.8rem;padding:0.25rem 1rem;margin-bottom:1rem;position:absolute;top:27px;left:50%; transform:translateX(-50%);width:120px;margin-left:120px;}
.main-container main .qust .info.hide{visibility:hidden;}
/*============ Layout > Result ============*/
.result{margin-bottom:50px;margin-top:10px;}
.result .res-body{position:relative;text-align:center;display:inline-block;}
.result .res-body .character{display:block;max-width:140px;margin:0 auto;width:40%;margin-bottom:20px;position:absolute;right:-40px;top:-50%;transform:translateY(-30%) rotate(10deg);}
.result .res-body .msg{display:block;margin:0 auto;width:100%;max-width:480px;}
/*============ Layout > Footer ============*/
.main-container footer{height:var(--size-footer-height);width: 100%;margin:10px auto;}
/*============ Layout > Slide Menu ==============*/
#slide-out{padding: 10px;}
.side-nav{padding:0 !important;}
.side-nav section{height:100vh;display:flex;justify-content: space-between;flex-direction: column;}
.side-nav section header{position:relative;}
.side-nav section header .btn-logout{position:absolute;top:0;right:0;padding:10px 20px;color:var(--color-primary-em);}
.side-nav .user-data{background:var(--color-primary-bg-light);height:70px;display:flex;align-items: center;padding: 10px;}
.side-nav .user-img{width: 51px;height: 51px;border-radius: 50%;overflow: hidden;margin-right: 10px;}
.side-nav .user-img img{width:100%;height:100%;display: block;}
.side-nav .user-name h4{font-size: 1rem;color: var(--color-primary-em);}
.side-nav .user-name small{opacity: 0.7;color: var(--color-primary-em);}
.side-nav .study-data{height: 100%;}
.side-nav .study-data h4{background-color: var(--color-primary-bg-light);padding:10px;padding-top: 40px;color:var(--color-primary-em);font-weight: 700;font-size: 0.9rem; display: flex; align-items: center;}
.side-nav .study-data ul{display: flex;justify-content: space-between;border-bottom: 1px solid var(--color-primary-bg-light);}
.side-nav .study-data li{padding:0 10px;height: 50px;line-height: 50px !important;}
.side-nav .study-data li.head{font-weight: 800;font-size: .8rem;}
.side-nav footer{position:sticky;left:0;bottom:0;width:100%;}
.side-nav footer .btn{text-align:center;margin: 0;width:100%;display:block;}
/*============ Layout > login ============*/
.login{background:#f8f3f9;}
.login .page-container{width:90%;max-width:800px; background:#f2edf3;text-align: center;border-left: 2px solid var(--color-border);border-right: 2px solid var(--color-border);box-shadow: 0 0 20px 0 rgba(0,0,0,0.5);}
.login .page-container > section{display:flex; justify-content:space-between;flex-direction: column;align-items: center;height: 60%;max-height: 400px;}
.login .page-container h1.logo{border-bottom:2px solid #c5aeca;display: inline-block;padding-bottom: 10px;font-size: 2rem;padding-left: 0;}
.login .page-container fieldset{border:none;outline:none;margin-top: 20px;width: 100%;}
.login .page-container h2{font-size:2rem;font-weight: 800; color: var(--color-primary-em);margin:10px auto;}
.login .page-container form{width: 95%;margin: 30px auto 0;}
.login .page-container .form-input{position: relative;width: 100%;margin-bottom: 15px;height: 40px;}
.login .page-container .form-input::before{content:attr(data-val);position: absolute;top: 50%;transform: translateY(-50%); left: 5px;color: #000;z-index: 2;display: block;color:var(--color-primary-em);font-weight: 700;}
.login .page-container input{border: 1px solid var(--color-border);outline:none;background: none;text-indent: 80px;width: 100%;height: 100%;color: var(--color-primary);}
.login .page-container input::placeholder {color: var(--color-border);font-style: italic;opacity: 0.5;}
.login .page-container button{margin: 20px auto;}
/*============ Layout > report ============*/
.report .container{min-width:650px;text-align: center;}
.report table.table{margin:0;font-size:1rem;}
.report table.table{width: 100%;border-bottom: 1px solid #1a1b1b;margin: 0 auto;border-collapse: collapse;}
.report table.table th{font-weight: 700;border: 1px solid #fff;background:var(--color-primary)}
.report table.table th, td{padding:.5em !important;}
.report table.table td{border: 1px dashed rgba(26,27,27,0.5);border-left: none;}
.report table.table td:last-child{border-right: none;}
.report table.table th:first-child{border-radius: 10px 0 0 0;}
.report table.table th:last-child{border-radius: 0 10px 0 0 ;}
.report table.table .user td{font-weight: 700;color: var(--color-primary);}

.report-data{background: var(--color-primary-bg-light);width: 100%;padding:20px 10px;text-align: center;}
table.table-data{width: 98%;border-bottom: 1px solid #1a1b1b;margin: 0 auto;border-collapse: collapse;font-size:0.8rem;min-width:560px;}
table.table-data thead{background:#a984ad;color:#fff;}
table.table-data th{font-weight: 700;border: 1px solid #fff;word-wrap:break-word;}
table.table-data th, table.table-data td{padding:.5em !important ;border-top: none;max-width:60px;text-overflow:ellipsis;overflow:hidden;}
table.table-data td{border: 1px dashed rgba(26,27,27,0.5);border-left: none;background: #fff}
table.table-data td.x{color: var(--color-danger);font-weight: 800;background: var(--color-qust-bg);}
table.table-data td.no{font-weight:bold;max-width:40px !important;}
/*table.table-data td.no.TY02{background: var(--color-TY02-bg);}*/

table.table-data td:last-child{border-right: none;}
table.table-data th:first-child{border-radius: 10px 0 0 0;border-left: none;}
table.table-data th:last-child{border-radius: 0 10px 0 0 ;border-right: none;}
table.table-data tr.active{background:var(--color-primary-bg-light);color: var(--color-primary-em);}
table.table-data tr.active > td{font-weight: 800;}

.report-info{text-align:right;margin:-10px 10px 10px;color:var(--color-primary);}

/*============ 보기 템플릿 ============*/
.examples{width:100%;max-width:500px;height:100%;max-height:200px;display:grid;grid-gap:1.5rem;grid-template-columns:1fr 1fr;}
.examples > label{display:flex;justify-content:center;align-items:center;cursor:pointer;padding:10px; background:var(--color-qust-text);border:2px solid var(--color-qust-text);color:#fff;border-radius:.7rem;transition:0.1s;font-size:1.2rem;font-weight:bold;text-align:center;word-break: keep-all;}
.examples > label:hover{transform:scale(1.05);}
/*.examples > label:has(input:checked){background:#e7e7e5;color:var(--color-qust-text);}*/
.examples > label.active{background:#e7e7e5;color:var(--color-qust-text);}
.examples > label > input[type=radio]{display:none !important;}

/*============== Layout Moblie ===============*/
@media (min-width:641px) { .none-pc{display:none !important;} .hide-pc{visibility:hidden !important;} }
/*mobile responsive*/ 
@media (max-width:640px) {
    /*============ Layout > Header ============*/   
    .none-mobile{display:none !important;}
    .hide-mobile{visibility:hidden !important;}
    #btn-slide{padding: 10px;margin-top: -15px !important;display:block;color: var(--color-primary-em);}
    body{
        --size-container-width:100%;
        --size-header-height:44px;
        --size-footer-height:40px;
        --size-main-height:calc(100vh - var(--size-header-height) - var(--size-footer-height) - var(--marigin-top) - 1px);
        --marigin-top:40px;
    }
    body.swtest{--size-footer-height:80px;}
	body.report{--size-header-height:80px;}
    .main h1.logo{font-size: 1.5rem;padding-left: 10px;}
    .check-label{font-size: 0.9rem;}
    .check-label > input{transform: scale(1.2);outline:none}
    .fix-bottom{position: fixed !important;bottom: 0;left: 0;}
    /*============ Layout > Main ============*/
    .main table.table thead{display:none;}
    .main table.table, .main table.table tbody, .main table.table tr, .main table.table td{display:block; width:100%;}
    .main table.table tr{margin-bottom: 20px;border-radius: 12px;}
    .main table.table tr:nth-child(even){background:#f7f7f7;}
    .main table.table td{text-align: right; padding-left: 50%;position: relative;height:40px;}
	.main table.table td.tit{height:55px;}
    .main table.table td::before{content:attr(data-label);position: absolute; left: 0; width: 50%;padding-left:15px;font-weight: bold;text-align: left;}
    .main table.table td{border-left: 1px solid rgba(26,27,27,0.5);border-right: 1px solid rgba(26,27,27,0.5);border-bottom: 1px dashed rgba(26,27,27,0.5);}
    .main table.table td:first-child{border-radius: 10px 10px 0 0;border-top: 1px solid rgba(26,27,27,0.5);}
    .main table.table td:last-child{border-radius: 0 0 10px 10px;border-top:1px dashed rgba(26,27,27,0.5);border-bottom: 1px solid rgba(26,27,27,0.5);border-right: 1px solid rgba(26,27,27,0.5);}
    
    .btn{padding:15px 20px;display:block;margin:0;font-weight: 700;background: var(--color-primary-bg); color: #fff;}
    .btn::before{display:none;}    .btn::after{display:none;}    .btn:hover::before{animation: none;}    .btn:hover::after{animation: none;}
    .btn:active{opacity: 0.9;}

    /*============ Layout > Test ============*/
	.main-container main{margin-bottom:var(--size-footer-height);}
	/*.main-container main .qust h1{font-size:1.5rem;}*/
	/*.main-container main .qust h2{font-size:2rem;}*/
    .main-container main .qust input{width:100%;font-size:1.5rem;}
    .main-container main .qust{min-height:calc(var(--size-main-height) - 150px);padding:25px;}
    .swtest footer section{display:flex;flex-direction:column-reverse;}

	.main-container main .qust .info{position:static;}

    .progress{height: 10px; border-radius: 0;border:none;background-color:var(--color-primary-bg-light)}
    .progress .bar{ border-radius: 0;}
    .progress .icon{transform:scale(.8);top:-45px;opacity:0.5;}
    .progress .bar.max .icon{opacity: 0;}
    .progress p{position:absolute;top:-1.2rem;right:0;font-size: .7rem;}
    @keyframes anim-prog-icon{0% {transform: scale3d(.8, .8, .8);}30% {transform: scale3d(1.15, 0.65, .8);}40% {transform: scale3d(0.65, 1.15, .8);}50% {transform: scale3d(1.05, 0.75, .8);}65% {transform: scale3d(0.85, 0.95, .8);}75% {transform: scale3d(0.95, 0.85, .8);}100% {transform: scale3d(.8, .8, .8);}}
    
	.main-container main .qust p.hint{font-size:.8rem;}
	.main-container main .qust p.hint:after{width:8px;height:8px;left:2px;}
	/*============ Layout > Result ============*/
	.result .res-body .character{display:block;max-width:175px;margin:0 auto;width:80%;margin-bottom:20px;position:initial;transform:none;}
    /*============ Layout > Footer ============*/
    .main-container footer{position: fixed;bottom: 0;left: 0;display:flex;flex-direction: column;justify-content: flex-end;margin-bottom:0;}
    .main-container .btn{display: block;width: 100%;margin: 0 auto;text-align:center;}

    /*============ Layout > login ============*/
    .login h1{font-size: 1.5rem !important;}
    .login h2{font-size: 1.3rem !important;}

	/*============ 보기 템플릿 ============*/
    .examples{grid-template-columns:1fr;max-height:300px;}
    .examples > label{font-size:1rem;}
}
/*mobile responsive*/
#modal_browser{max-width:800px;}
.modal-content.my{word-break: keep-all;line-height:1.5rem}
.modal-content.my > h3 {margin:20px 0;}
.modal-content.my > p {margin-bottom:40px;}