@charset "utf-8";

/* COMMON */

p {
    margin-top: 0;
    margin-bottom: 0 !important;
}

/* HEADER */
.header{width:100%; height:100px; padding:0 30px; position:fixed; top:0; left:0; background-color:#fff; border-bottom:1px solid #f3f3f3; display:flex; align-items:center; justify-content:space-between; z-index:800;}

.header .menu, .header .info{display:flex; align-items:center;}

.header .logo{margin-right:40px;}
.header .logo img{height:24px;}

.header .nav{display:flex; align-items:center; z-index:760;}
.header .nav .list{margin-left:30px; position:relative;}
.header .nav .list .depth01{display:block; font-size:1.286em; font-weight:500; letter-spacing:-0.07em; line-height:20px; padding:40px 10px;}
.header .nav .list .depth01.on:after, .header .nav .list .depth01:hover::after{content:''; width:100%; height:5px; background-color:#00c0c7; position:absolute; bottom:0; left:0;}
.header .nav .list .snb{width:100%; background-color:#fff; border-bottom:1px solid #f3f3f3; padding:30px 0; position:fixed; top:100px; left:0; display:none;}
.header .nav .list ul{display:flex; flex-wrap:wrap; align-items:center;}
.header .nav .list ul li{margin:10px 40px 10px 0;}
.header .nav .list ul .depth02{display:block; font-size:1.143em; letter-spacing:-0.07em; line-height:18px; padding-left:10px; position:relative;}
.header .nav .list ul .depth02:after{content:''; display:block; width:3px; height:3px; border-radius:3px; background-color:#000; position:absolute; top:8px; left:0;}
.header .nav .list ul .depth02:hover{font-weight:500; color:#00c0c7;}
.header .nav .list ul .depth02:hover::after{background-color:#00c0c7;}
.header .nav .list02 .snb{padding-left:215px;}
.header .nav .list03 .snb{padding-left:415px;}
.header .nav .list04 .snb{padding-left:560px;}
.header .nav .list05 .snb{padding-left:720px;}
.header .nav .list06 .snb{padding-left:850px;}

.header .info .type{padding:7px 10px; color:#fff; letter-spacing:-0.07em; line-height:16px; background-color:#00c0c7; border-radius:30px;}
.header .info .type a {color:#fff; }
.header .info .user{margin:0 20px 0 12px; font-size:1.286em; font-weight:500; letter-spacing:-0.07em; line-height:1.3em;}
.header .info .logout_btn img{width:18px;}
.header .info .logout_btn:hover{opacity:0.6;}

.header .snb_bg{width:100%; height:calc(100% - 100px); position:fixed; top:100px; left:0; background-color:rgba(0,0,0,0.5); display:none; z-index:750;}


/* MOBILE MENU */
.nav_open{display:none;}
.nav_open img{width:22px; height:22px;}

.mobile_menu{width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:fixed; top:0; left:0; display:none; z-index:810;}
.mobile_menu .inner{width:85%; max-width:450px; height:100%; float:right; background-color:#f2f2f2;}

.mobile_menu .top{background-color:#00c0c7;}
.mobile_menu .top .logo{padding:20px; display:flex; align-items:center; justify-content:space-between;}
.mobile_menu .top .logo h2 img{height:24px;}
.mobile_menu .top .logo .nav_close img{width:20px;}
.mobile_menu .top .info{padding:20px 20px 45px; border-top:1px solid rgba(255,255,255,0.3); display:flex; align-items:center; justify-content:space-between;}
.mobile_menu .top .info ul{display:flex; align-items:center;}
.mobile_menu .top .info .type{padding:7px 10px; color:#fff; letter-spacing:-0.07em; line-height:16px; background-color:#333; border-radius:30px;}
.mobile_menu .top .info .user{margin-left:12px; font-size:1.286em; font-weight:500; color:#fff; letter-spacing:-0.07em; line-height:1.3em;}
.mobile_menu .top .info .logout_btn img{width:18px;}
.mobile_menu .top .info .logout_btn:hover{opacity:0.6;}

.mobile_menu .mobile_nav{width:calc(100% - 20px); margin:-25px auto 0; background-color:#fff; border-radius:10px; border:1px solid #e5e5e5; overflow:hidden;}
.mobile_menu .mobile_nav .m_depth01{display:block; font-size:1.143em; font-weight:500; line-height:20px; padding:15px 20px; border-bottom:1px solid #e5e5e5; position:relative;}
.mobile_menu .mobile_nav .m_depth01:after{content:''; width:9px; height:9px; background:url(../img/common/aw_nav.svg) no-repeat center; background-size:100%; position:absolute; top:50%; right:20px; margin-top:-4px;}
.mobile_menu .mobile_nav .m_depth01.arrow:after{transform:rotate(90deg);}
.mobile_menu .mobile_nav .m_depth01.arrow.on:after{transform:rotate(-90deg);}
.mobile_menu .mobile_nav .m_depth01.on{color:#00c0c7;}
.mobile_menu .mobile_nav .m_snb{padding:20px; background-color:#f9f9f9; border-bottom:1px solid #e5e5e5; display:none;}
.mobile_menu .mobile_nav .m_snb li{margin-bottom:10px;}
.mobile_menu .mobile_nav .m_snb li:last-child{margin-bottom:0;}
.mobile_menu .mobile_nav .m_snb li a{display:inline-block; padding-left:10px; position:relative;}
.mobile_menu .mobile_nav .m_snb li a:after{content:''; display:block; width:3px; height:3px; border-radius:3px; background-color:#000; position:absolute; top:9px; left:0;}
.mobile_menu .mobile_nav .m_list:last-child .m_depth01, .mobile_menu .mobile_nav .m_list:last-child .m_snb{border-bottom:0;}
.mobile_menu .mobile_nav .m_list:last-child .m_snb{border-top:1px solid #e5e5e5;}


/* FOOTER */
.footer{background-color:#2b2b2b; padding:30px 0 30px;}
.footer .copy{font-size:0.98em; color:#aaa; text-align:center;}



/* RESPONSIVE */
@media screen and (max-width : 1600px){
	/* HEADER */
	
}


@media screen and (max-width : 1280px){
	/* HEADER */
	.header .logo{margin-right:0;}
	
	.header .nav .list{margin-left:20px;}
	.header .nav .list .depth01{font-size:1.143em; padding:40px 5px;}
	.header .nav .list02 .snb{padding-left:220px;}
	.header .nav .list03 .snb{padding-left:320px;}
	.header .nav .list04 .snb{padding-left:435px;}
	.header .nav .list05 .snb{padding-left:560px;}
	.header .nav .list06 .snb{padding-left:665px;}
	
	.header .info .user{font-size:1.143em;}
}


@media screen and (max-width : 960px){
	/* HEADER */
	.header{height:80px;}
	
	.header .menu .nav, .header .info{display:none;}
	
	
	/* MOBILE MENU */
	.nav_open{display:block;}
	
	
	/* FOOTER */
	.footer{padding:30px 0 100px;}
	.footer .copy{font-size:1em;}
}


@media screen and (max-width : 640px){
	/* HEADER */
	.header{height:65px;padding:0 4.5%;}
	
	.header .logo img{height:22px;}
	
	
	/* MOBILE MENU */
	.mobile_menu .top .logo{padding:15px 4.5%;}
	.mobile_menu .top .logo h2 img{height:22px;}
	.mobile_menu .top .logo .nav_close img{width:16px;}
	.mobile_menu .top .info{padding:15px 4.5% 40px;}
	.mobile_menu .top .info .type{font-size:0.929em; line-height:12px;}
	.mobile_menu .top .info .user{font-size:1.143em; margin-left:10px;}
	
	.mobile_menu .mobile_nav .m_depth01{padding:12px 15px; font-size:1.071em; line-height:18px;}
	.mobile_menu .mobile_nav .m_depth01:after{right:15px;}
	.mobile_menu .mobile_nav .m_snb{padding:10px 15px;}
	.mobile_menu .mobile_nav .m_snb li{margin-bottom:5px;}
	.mobile_menu .mobile_nav .m_snb li a{font-size:0.929em;}
	
	
	/* FOOTER */
	.footer{padding:30px 0 60px;}
	.footer .copy{font-size:0.929em;}
}