@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo+Black&family=Bungee&family=Monoton&family=Quantico:ital,wght@0,400;0,700;1,400;1,700&family=Teko:wght@300..700&display=swap');

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight:500;
    font-style:normal;
}

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight:300;
    font-style:normal;
}

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight:800;
    font-style:normal;
}

/* CSS Reset */
body,html,
header,footer,aside,nav,section,article,details,figure,figcaption,menu,command,
div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */
h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist,
img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */
a,label,output,dialog, /* Inline Element */
address,blockquote, /* Text Block Element */
p,pre,/* Text Inline Block Element */
span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */
acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */
map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;}
header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */
applet,basefont,center,dir,font,strike{display:none} /* XHTML4, HTML5 Element Not Used Remove */
q,blockquote{quotes:none;content:none}
li,menu{list-style:none;word-break:break-all}

table{width:100%;border-spacing:0;border-collapse:separate;} /* Table Border (separate) */
caption{text-align:left}
th,td{text-align:center;vertical-align:middle}

address{font-style:normal}
label{display:inline-block;}
a{text-decoration:none;display:inline-block;} /* A Attribute  */

/* Common Setting */
html{overflow-y:auto;}
html,body{height:100%;} /* Horizen Scroll */
body {color:#333;font-size:17px;font-family:"GmarketSans", "Montserrat", 'Noto Sans KR',  Pretendard, -apple-system, BlinkMacSystemFont, 'GmarketSans', 'Noto Sans KR', sans-serif, "Nanum Gothic";font-weight:400;min-width:320px;background-color:#F3F3F3;}
div{outline:0}
img {vertical-align:middle;}

::selection {background-color:#af1c1c;color:#fff;}

.clear{position:relative;clear:both;}

.warp {position:relative;width:500px;margin:30px auto;padding:0;background-color:white;text-align:center;}

.topphoto {position:relative;width:100%;min-height:590px;background-position:center;background-size:auto;background-attachment:fixed;background-position:top;}

.profile {position:relative;background-color:white;margin-top:-50px;border-top-left-radius:50px;border-top-right-radius:50px;}
.profile .profile_photo {width:170px;border-radius:50%;border:solid 5px #FFF;margin-top:-85px;}
.profile h1 {font-family:'Montserrat';font-weight:400;font-size:42px;padding:15px 0 10px 0;}
.profile h1 b {font-weight:800;}
.profile p {opacity:0.7;line-height:30px;}
.profile span {font-family:'Montserrat';font-weight:700;font-size:15px;}

.sns {position:relative;padding:20px 0;}
.sns a {padding:0 5px;}
.sns a img {width:40px;}

.link {position:relative;padding:0 20px 30px 20px;}
.link li {margin:10px 0;background-color:#f2f2f2;border-radius:25px;border:dashed 1px #a3a3a3;}
.link li a {display:block;font-size:17px;padding:35px 0;}
.link .imp {background-color:#000;color:#FFF;border:0px;}
.link .en {font-family:'Montserrat';font-weight:700;}
.link .viewchat {color:#ca3e00;}
.link .imp b {color:#ffc600;}

.thum {position:relative;padding:0px 20px 0 20px;border-top:solid 20px #f2f2f2;}
.thum li {float:left;width:calc(50% - 10px);margin-right:10px;margin-bottom:10px}
.thum li:nth-child(even) {margin-right:0px;}

.thum h1 {font-size:24px;padding-top:40px;}
.thum span {font-size:13px;opacity:0.5;}

.swiper-slide {padding:20px 0 60px 0;}
.swiper-slide img {width:100%;border-radius:15px;filter:grayscale(0);opacity:0.9;}

.thum .swiper-pagination {bottom:0px;}
.thum .swiper-pagination-bullet {height:10px;width:10px;background:#cbcbcb;border-radius:10px;margin:0 2px !important;opacity:0.8;border:1px solid #FFF;}
.thum .swiper-pagination-bullet-active {background:#000;border:1px solid #000;width:30px;}

.copy {clear:both;font-size:12px;font-family:'Montserrat';font-weight:600;color:#333;padding:20px 0 20px 0;letter-spacing:1px;border-top:solid 2px #f2f2f2;background-color:#e9e9e9;}


.faqtop {position:relative;background-color:#333;color:white;padding:20px 0;}
.faqtop a {position:absolute;top:20px;left:10px;}
.faqtop a span {font-size:30px;}
.faqtop h1 {font-size:20px;}

.faq {position:relative;text-align:left;padding:20px;}
.faq li {position:relative;}
.faq li a {font-size:20px;}
.faq li span {font-size:20px;position:absolute;top:26px;right:0px;color:#999;}
.faq li b {color:#da0100;}
.faq li:first-child {border-bottom:solid 1px #e5e5e5;padding:22px 0;}
.faq li:last-child {font-size:17px;line-height:28px;padding:24px 20px;border-bottom:solid 1px #e5e5e5;background-color:#fffef9;display:none;}
.faq ul:last-child li:first-child {border-bottom:0;}

.faq .on li span {transform:rotate(180deg);}
.faq .on li:last-child {display:block;}

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

.warp {width:100%;margin:0px}

.topphoto {min-height:72.5vh;}

.profile {margin-top:-50px;border-top-left-radius:25px;border-top-right-radius:25px;}
.profile .profile_photo {width:120px;margin-top:-60px;}
.profile h1 {font-size:36px;padding:10px 0 5px 0;}
.profile p {line-height:24px;font-size:15px;}
.profile span {font-size:13px;}

.sns a img {width:35px;}

.link {padding:0 10px 30px 10px;}
.link li {margin:5px 0;border-radius:15px;}
.link li a {font-size:15px;padding:25px 0;}

.thum {position:relative;padding:30px 10px 0 10px;border-top:solid 10px #f2f2f2;}
.thum li {float:left;width:calc(50% - 3px);margin-right:5px;margin-bottom:5px}
.thum li:nth-child(even) {margin-right:0px;}
.thum li img {border-radius:5px;width:auto;}

.copy {clear:both;font-size:11px;}

.faq {padding:10px;}
.faq li a {font-size:17px;}
.faq li span {top:22px;}
.faq li:first-child {padding:20px 0;}
.faq li:last-child {font-size:15px;line-height:26px;padding:20px 18px;}

}