@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
body{font-family: 'Noto Sans KR', sans-serif;}
 
*{-o-box-sizing:border-box;-ms-box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html,body, div, span, object, iframe,
h1,h2,h3,h4,h5,h6, p,
blockquote,pre,abbr,address,cite,code, del,dfn, em,imh,ins,
kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,
mark,audio,video{
	margin:0;
	padding:0;
	border:0;
	background:transparent;
}
ul,ol {
    list-style: none;
    list-style-image: none;
}

.hidden{display:none !important;}

.httpRequest_bg{position:absolute;top:0px;left:0px;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:900000;}
.httpRequest_bg i{position:relative;top:50%;left:50%;margin-top:-24px;margin-left:-24px;font-size:48px;color:#fff;z-index:900001;}

.intro_stage{position:relative;width:1038px;margin:0 auto;}
.intro_stage .color_block{position:absolute;width:100px;height:100px;z-index:1;}
.intro_stage .color_block.green{top:0;left:0;background-color:#009781;}
.intro_stage .color_block.orange{bottom:0;right:0;background-color:#D89429;}
.intro_stage .content_block{position:relative;padding:24px;z-index:10;}
.intro_stage .announce_wrapper{background-color:#fff;border:1px SOLID #c4c4c4; border-radius:12px;padding:36px 0px;}
.intro_stage .announce_wrapper p{text-align:center;line-height:180%;}
.intro_stage .selector_wrapper{background-color:#fff;border:1px SOLID #c4c4c4; border-radius:12px;padding:24px 0;margin-top:-1px;}
.intro_stage .selector_wrapper .style_list{overflow:hidden;width:720px;margin:0 auto;}
.intro_stage .selector_wrapper .style_list li{float:left;width:50%;text-align:center;}
.intro_stage .selector_wrapper .style_list .label{display:inline-block;width:100%;color:#a9a9a9;text-align:center;padding-bottom:12px;}
.intro_stage .selector_wrapper .style_list .selected .label{color:#000;font-weight:bold;}
.intro_stage .selector_wrapper .style_list .icon{display:inline-block;overflow:hidden;width:240px;height:240px;background-repeat:no-repeat;background-position:center center;background-size:cover;border-radius:120px;}
.intro_stage .selector_wrapper .style_list .icon1{background-image:url('images/category1_1.png');}
.intro_stage .selector_wrapper .style_list .icon2{background-image:url('images/category2_1.png');}
.intro_stage .selector_wrapper .style_list .mask{display:inline-block;width:240px;height:240px;}

.intro_stage .selector_wrapper .style_list .mask{background-color:rgba(255,255,255,0.6)}
.intro_stage .selector_wrapper .style_list .selected .mask{background-color:transparent;}
.intro_stage .selector_wrapper .instroction_block{width:720px;margin:0 auto;padding:12px 0 24px 0;}
.intro_stage .selector_wrapper .instroction_indigator{height:60px;}
.intro_stage .selector_wrapper .instroction_indigator1{text-align:left;padding-left:120px;}
.intro_stage .selector_wrapper .instroction_indigator2{text-align:right;padding-right:120px;}
.intro_stage .selector_wrapper .instroction_indigator_icon{display:inline-block;width:120px;height:60px;background-image:url('images/indigator.svg');background-repeat:no-repeat;background-position:center center;background-size:contain;}

.intro_stage .selector_wrapper .instroction_content{overflow:hidden;background-color:#e9e9e9;padding:24px 0;}
.intro_stage .selector_wrapper .instroction_content li{float:left;}
.intro_stage .selector_wrapper .instroction_content .title {width:156px;padding-left:36px;line-height:120%;padding-top:6px;}
.intro_stage .selector_wrapper .instroction_content .title .big{font-size:24px; font-weight:bold;letter-spacing:-0.05em;}
.intro_stage .selector_wrapper .instroction_content .title .gen{font-size:14px; font-weight:bold;letter-spacing:-0.05em;}
.intro_stage .selector_wrapper .instroction_content .cont{width:564px;padding:0 24px;}
.intro_stage .selector_wrapper .instroction_content .cont p{font-size:12px;line-height:200%;letter-spacing:-0.03em;}


.home_stage{position:relative;width:1038px;height:640px;margin:0 auto;background-color:#f5f5f5;background-repeat:no-repeat;background-position:center center;background-size:cover;}
.display_container{position:relative;width:1038px;height:640px;z-index:2;}
.display_block{position:absolute;width:1038px;height:640px;background-repeat:no-repeat;background-position:center center;background-size:cover;z-index:2;}

.main_navigation_block{position:absolute;top:50%;right:0;width:72px;height:252px;background-color:rgba(0,0,0,0.4);padding-top:6px;margin-top:-126px;z-index:10}
.mnb_list{overflow:hidden;width:48px;height:240px;margin:0 auto;}
.mnb_list li{float:left;overflow:hidden;width:48px;height:48px;border-radius:24px;margin:6px 0;}
.mnb_list li button{width:48px;height:48px;font-size:12px;color:#fff;border:none;}
.mnb_list li button.selected{cursor:default;color:#000;font-weight:bold;background-color:#D89429;}
.mnb_list li button:not(.selected){cursor:pointer;background-color:rgba(0,0,0,0.6);}
.mnb_list li button:not(.selected):hover{background-color:rgba(0,0,0,1);}


.sub_navigation_block{position:absolute;bottom:0;left:50%;width:360px;margin-left:-180px;z-index:11;}
.detail_navigation_block{overflow:hidden;width:360px;height:84px;background-color:rgba(0,0,0,0.4);}
.snb_list{width:360px;height:72px;text-align:center;padding-top:12px;}
.snb_list button{width:52px;height:52px;font-size:12px;color:#fff;border:none;border-radius:24px;margin:0 6px;}
.snb_list button.selected{cursor:default;color:#000;font-weight:bold;background-color:#D89429;}
.snb_list button:not(.selected){cursor:pointer;background-color:rgba(0,0,0,0.4);}
.snb_list button:not(.selected):hover{background-color:rgba(0,0,0,1);}

.sub_navigation_block .arrow_section{float:left;width:60px;height:76px;text-align:center;padding-top:22px;}
.sub_navigation_block .left_arrow, 
.sub_navigation_block .right_arrow{display:inline-block;width:48px;height:48px;border:none;background-color:transparent;}
.sub_navigation_block .left_arrow:not([disabled]){cursor:pointer;background-image:url('images/left_arrow.svg');background-repeat:no-repeat;background-position:center center;background-size:40%;}
.sub_navigation_block .right_arrow:not([disabled]){cursor:pointer;background-image:url('images/right_arrow.svg');background-repeat:no-repeat;background-position:center center;background-size:40%;}

.sub_navigation_block .detail_section{overflow:hidden;float:left;width:240px;height:76px;text-align:center;padding-top:2px;}

.detail_ist {overflow:hidden;width:100%;height:76px;}
.detail_ist li{float:left;width:60px;padding:0 6px;height:68px;}
.detail_ist li a{display:inline-block;overflow:hidden;width:48px;height:68px;}

.detail_ist li a:not(.selected){cursor:pointer;}
.detail_ist li .label{display:inline-block;float:left;width:48px;height:20px;line-height:20px;font-size:11px;color:#fff;text-align:center;}
.detail_ist li .icon{display:inline-block;float:left;overflow:hidden;width:48px;height:48px;background-color:#ccc;background-repeat:no-repeat;background-position:center center;background-size:cover;border-radius:6px;}

.detail_ist li .selected .label{color:#D89429;font-weight:bold;}
.detail_ist li .selected .icon{border:2px SOLID #000;}

.center_list{display:inline-block;width:auto;}

.global_navigation_block{position:absolute;left:12px;bottom:12px;width:72px;height:60p;z-index:20}
.global_navigation_block a{display:inline-block;cursor:pointer;width:48px;height:48px;
background-color:rgba(0,0,0,0.6);background-image:url('images/home.svg');background-repeat:no-repeat;background-position:center center;background-size:60%;border-radius:24px;}
.global_navigation_block a:hover{background-color:rgba(0,0,0,1);}
