@charset "utf-8";


/* 스킵 */
#u_skip{position:relative;width:100%;z-index:9999}
#u_skip a{position:absolute;top:-100px;left:0;display:block;margin:0;width:100%;padding:15px 0;text-align:center;background-color:#333;color:#fff;opacity:0;transition:.3s}
#u_skip a:hover,
#u_skip a:focus,
#u_skip a:active{top:0;opacity:1}

#wrap{padding:0 20px;max-width:1760px;margin:0 auto}

#header{position:relative;left:0;top:0;padding-bottom:2px;border-bottom:2px solid var(--color-gray100);z-index:5000;transition-delay:1.5s;transition:.3s;}
.scroll #header{position:sticky;width:100%;max-width:1760px;background:var(--color-gray05);}

#header .inner{display:flex;justify-content:space-between;align-items:center;padding:24px 0 8px;border-bottom:1px solid var(--color-gray100)}

#header .site_id{display:inline-block;flex:0 0 100px}
#header .site_id a{display:block;width:100%;height:0;padding-top:31.5%;text-indent:-9999em;overflow:hidden;background:url(/images/logo_anrrc.svg) no-repeat 0 50% / contain}

#header .utill{display:flex;flex-direction:row;align-items:center;gap:4px;height:48px;}
#header .utill .btn_srch_open{background:transparent;border:0;height:48px;width:fit-content;padding:0 10px}
#header .utill .btn_srch_open i{display:block;width:24px;height:100%;text-align:left;text-indent:-9999em;overflow:hidden;background:url(/images/btn_srch.svg) no-repeat 0}

#header .utill .btn_menu{width:fit-content;height:48px;background:transparent;border:0;padding:0 12px}
#header .utill .btn_menu i{display:block;position:relative;width:24px;height:2px;text-align:left;text-indent:-9999em;background:var(--color-gray100);transition:background .2s ease}
#header .utill .btn_menu i::before,
#header .utill .btn_menu i::after{content:'';display:block;position:absolute;left:0;width:100%;height:2px;background:var(--color-gray100);transition:transform .2s ease}
#header .utill .btn_menu i::before{top:-6px}
#header .utill .btn_menu i::after{top:6px}


/*
#header.menu_active .utill .btn_menu{position:fixed;z-index:999;background:rgba(0, 0, 0, .2)}
#header.menu_active .utill .btn_menu i{background:transparent}
#header.menu_active .utill .btn_menu i::before,
#header.menu_active .utill .btn_menu i::after{top:50%;background:#fff}
#header.menu_active .utill .btn_menu i::before{transform:rotate(45deg)}
#header.menu_active .utill .btn_menu i::after{transform:rotate(-45deg)}
*/

#header .btn_menu_close{display:none;position:absolute;right:20px;top:25px;height:48px;width:48px;background:rgba(0, 0, 0, .2);border:0;}

#header.menu_active .btn_menu_close{display:block;}
#header.menu_active .btn_menu_close i{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background:transparent;width:24px;height:24px;}
#header.menu_active .btn_menu_close i::before,
#header.menu_active .btn_menu_close i::after{content:'';display:block;position:absolute;top:50%;left:0;width:100%;height:2px;background:#fff;transition:transform .2s ease}
#header.menu_active .btn_menu_close i::before{transform:rotate(45deg);}
#header.menu_active .btn_menu_close i::after{transform:rotate(-45deg);}

#header.srch_active .utill .form_srch{display:block}

#header .utill .tsrch{position:relative;height:100%}

#header .utill .form_srch{display:none;position:absolute;right:-6px;top:50%;height:100%;width:min(calc( 100vw - 86px), 282px);padding:0 52px 0 16px;border-radius:24px;background:#fff;transform:translateY(-50%);box-shadow:0 0 10px rgba(0, 0, 0, .1)}
#header .utill .form_srch .inp_srch{width:100%;border:0;height:100%;background:transparent}

#header .utill .form_srch .btn_srch{position:absolute;right:6px;top:50%;width:fit-content;height:100%;padding:0 10px;transform:translateY(-50%);background:transparent;border:0;border-radius:50%}
#header .utill .form_srch .btn_srch i{display:block;width:24px;height:100%;text-align:left;text-indent:-9999em;overflow:hidden;background:url(/images/btn_srch.svg) no-repeat 0 50%}

#header #lnb{display:none;position:fixed;right:0;top:0;height:100vh;width:min(100vw, 400px);padding:85px 20px 20px;background:var(--color-gray100);color:#fff;z-index:990;overflow-y:auto}
#header #lnb .user,
#header #lnb .user_info{padding-bottom:26px;border-bottom:2px solid #fff}

#header #lnb .user .txt,
#header #lnb .user_info .txt{font-size:3.2rem;font-weight:600;line-height:1.4em}

#header #lnb .user .btn_login{display:block;margin-top:20px;width:100%;background:var(--color-point01);color:#fff;text-align:center}
#header #lnb .user .btn_login i{position:relative;padding-left:24px;line-height:5.2rem;font-weight:500}
#header #lnb .user .btn_login i::after{content:'';display:block;position:absolute;left:0;top:0;height:100%;width:20px;background:url(/images/ico_login_w.svg) no-repeat 50% 50%}
#header #lnb .user .sign_box{margin-top:16px}
#header #lnb .user .sign_box a{color:#fff;text-decoration:underline;margin-left:10px}

#header #lnb .user_info{display:flex;align-items:flex-end;justify-content:space-between}
#header #lnb .user_info .txt{font-size:3.2rem;font-weight:100}
#header #lnb .user_info .txt .user_id{font-weight:600;display:block;color:#fff}
#header #lnb .user_info .btn_logout{border:0;background:transparent;color:#fff;text-decoration:underline;font-size:1.8rem}

#header #lnb ul{}
#header #lnb ul li{position:relative}
#header #lnb ul:not(.depth02) > li{border-bottom:2px solid #fff}
#header #lnb ul a{display:block;color:#fff}

#header #lnb .depth01 div{position:relative;padding:12px 40px 12px 16px}
#header #lnb .depth01 div:not:has(.depth02){}
#header #lnb .depth01 div .btn_depth02{position:absolute;right:0;top:50%;transform:translateY(-50%);padding:0 8px;height:100%;width:fit-content;text-align:left;border:0;background:transparent}
#header #lnb .depth01 div .btn_depth02 i{display:block;text-indent:-9999em;overflow:hidden;width:24px;height:100%;background:url(/images/arr_down_w.svg) no-repeat 50% 50%;transition:transform .3s ease}
#header #lnb .depth01.depth_active div .btn_depth02 i{transform:rotate(180deg)}

#header #lnb .depth02{display:none}
#header #lnb .depth02 li{padding:8px 20px;background:var(--color-gray80)}
#header #lnb .depth02 li:not(:first-child){margin-top:1px}
#header #lnb .depth02 li a{font-size:1.4rem}

#header #lnb ul > li.depth_on{border-bottom:0}
#header #lnb ul > li.depth_on .btn_depth02 i{transform:rotate(180deg)}

#header .utill .btn_login{display:none;background:transparent;border:0;height:48px;width:fit-content;padding:0 10px}
#header .utill .btn_login i{display:block;width:24px;height:100%;text-align:left;text-indent:-9999em;overflow:hidden;background:url(/images/ico_login.svg) no-repeat 0}

#header .utill .user_info{display:none}
#header .utill .user_info .btn_logout{background:transparent;border:0;height:48px;width:fit-content;padding:0 4px}
#header .utill .user_info .btn_logout i{display:block;width:24px;height:100%;text-align:left;text-indent:-9999em;overflow:hidden;background:url(/images/ico_logout.svg) no-repeat 0}

@media (min-width:1400px){
	#wrap{padding:0 40px}
	#header .inner{padding:30px 0 16px}
	#header .site_id{flex:0 0 130px}

	#header #lnb{display:block !important;position:relative;right:auto;top:auto;width:auto;height:auto;padding:0;background:transparent;overflow:visible;position:absolute;left:50%;bottom:16px;transform:translateX(-50%)}
	#header #lnb .user,
	#header #lnb .user_info{display:none}

	#header #lnb > ul{display:flex;gap:0 20px}
	#header #lnb ul:not(.depth02) > li{border-bottom:0}
	#header #lnb ul a{position:relative;font-size:1.6rem;font-weight:500;color:var(--color-gray100);white-space:nowrap;transition:color .3s ease}
	#header #lnb ul a:hover,
	#header #lnb ul a:focus{color:var(--color-primary)}

	#header #lnb .depth01 div{padding:0}
	#header #lnb .depth01 > div.current > a{color:var(--color-primary)}
	#header #lnb .depth01 > div.current > a::after{content:'';display:block;height:6px;width:6px;border-radius:50%;background:var(--color-primary);position:absolute;left:50%;top:-2px;transform:translate(-50%, 0)}
	#header #lnb .depth01 div a{padding:10px 12px;font-size:1.8rem}
	#header #lnb .depth01 div .btn_depth02{display:none}

	#header #lnb .depth01.active .depth02{display:block !important}
	#header #lnb .depth02{position:absolute;left:0;top:100%;padding:10px 20px;border-top:2px solid var(--color-primary);background:#fff;box-shadow:0 5px 10px rgba(0, 0, 0, .1)}
	#header #lnb .depth02 li{padding:10px 0;background:transparent}
	#header #lnb .depth02 li:not(:first-child){margin-top:0;border-top:1px dashed var(--color-gray30)}
	#header #lnb .depth02 li a{position:relative;padding-left:0;padding-right:60px;min-width:220px;font-size:1.6rem;transition:padding-left .3s ease}
	#header #lnb .depth02 li a::after{content:'';display:block;width:20px;height:100%;position:absolute;right:4px;top:0;background:url(/images/arr_right.svg) no-repeat 50% 50%;opacity:.6;transition:right .3s ease}
	#header #lnb .depth02 li a:hover,
	#header #lnb .depth02 li a:focus{padding-left:4px}
	#header #lnb .depth02 li a:hover::after,
	#header #lnb .depth02 li a:focus::after{opacity:1;right:0}

	#header .utill{gap:10px}
	#header .utill .btn_login{display:block}
	#header .utill .btn_menu{display:none}
	#header .utill .user_info{display:flex}
	#header .utill .user_info .user_id{display:inline-block;line-height:48px;font-weight:500;color:var(--color-gray100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;word-break:break-all;max-width:60px}
	#header .utill .user_info .user_id:hover,
	#header .utill .user_info .user_id:focus{text-decoration:underline}
}

@media (min-width:1800px){
	#wrap{padding:0}
	#header #lnb > ul{display:flex;gap:0 40px}
	#header .utill .user_info .user_id{max-width:140px}
}

#footer{position:relative;padding-top:2px;border-top:2px solid var(--color-gray100);z-index:3000}
#footer .inner{display:flex;flex-direction:column;padding:20px 0 40px;border-top:1px solid var(--color-gray100)}
#footer .foot_link{padding:0 0 16px;border-bottom:1px solid var(--color-gray30)}
#footer .foot_link a{display:inline-block;position:relative;color:var(--color-gray100)}
#footer .foot_link a.link_riken{color:var(--color-point03)}
#footer .foot_link a.link_riken abbr{position:relative;display:block;padding-right:24px;text-decoration:none}
#footer .foot_link a.link_riken abbr::after{content:'';display:block;width:20px;height:20px;background:url(/images/ico_window02.svg) no-repeat 50%;position:absolute;right:0;top:50%;transform:translateY(-50%)}
#footer .foot_link a:not(:first-child){padding-left:17px;margin-left:16px}
#footer .foot_link a:not(:first-child)::before{content:'';display:block;height:12px;width:1px; background:var(--color-gray40);position:absolute;left:0;top:50%;transform:translateY(-50%)}

#footer .addr{position:relative;margin-top:20px;color:var(--color-gray60);font-size:1.4rem}
#footer .addr .site_id{display:none}
#footer .addr .copy a{color:var(--color-gray60);text-decoration:underline}

@media (min-width:1024px){
	#footer .inner{flex-direction:row-reverse;justify-content:space-between;padding:40px 0 60px}
	#footer a:hover,
	#footer a:focus{text-decoration:underline}
	#footer .foot_link{padding:0;border:0}
	#footer .addr{margin-top:0;font-size:1.6rem}
	#footer .addr .site_id{position:relative;display:inline-block;padding-right:17px;margin-right:16px;font-weight:600;font-size:1.6rem;color:var(--color-gray100)}
	#footer .addr .site_id::before{content:'';display:block;height:12px;width:1px; background:var(--color-gray40);position:absolute;right:0;top:50%;transform:translateY(-50%)}
	#footer .addr .copy a:hover,
	#footer .addr .copy a:focus{color:var(--color-point01)}

	#footer .addr .site_info p{display:inline-block}
}

#container{position:relative;padding:20px 0 40px}
#container .page_header{position:relative;color:#fff;text-align:center;background-position:50% 0;background-attachment:fixed;background-repeat:no-repeat;height:max(24vh, 260px);display:flex;justify-content:center;align-items:center}
#container .page_header::after{content:'';display:block;width:100%;height:100%;position:absolute;left:0;top:0;background:linear-gradient(rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, 1) 90%)}
#container .page_header.type01{background-image:url(/images/bg_sub01.jpg)}
#container .page_header.type02{background-image:url(/images/bg_sub02.jpg)}
#container .page_header.type03{background-image:url(/images/bg_sub03.jpg)}
#container .page_header.type04{background-image:url(/images/bg_sub04.jpg)}
#container .page_header.type05{background-image:url(/images/bg_sub05.jpg)}

#container .page_header .header_top{position:relative;z-index:1}
#container .page_header .header_top .tit_page{font-size:clamp(3.6rem ,3.8vw, 6.8rem);font-family:var(--font-family01);line-height:100%;font-weight:600;letter-spacing:2px}

.breadcumb{margin-bottom:16px}
.breadcumb li{position:relative;display:inline-block;font-size:1.2rem;vertical-align:middle}
.breadcumb li:not(:first-child){margin-left:6px;padding-left:14px}
.breadcumb li:not(:first-child)::before{content:'';display:block;width:6px;height:100%;position:absolute;left:0;top:50%;transform:translateY(-50%);background:url(/images/arr_breadcrumb.svg) no-repeat 50% 50%}
.breadcumb li a{color:var(--color-gray10)}
.breadcumb li strong{color:#fff;font-weight:500}
.breadcumb .home a{display:block;width:16px;height:100%;background:url(/images/ico_home.svg) no-repeat 50% 50%;text-align:left;text-indent:-9999em;overflow:hidden}

#container .page_header .snb{position:absolute;bottom:0;left:0;z-index:1;width:100%;height:54px}
#container .page_header .snb select{display:block;width:100%;height:100%;padding:0 20px;border:1px solid #000;border-top:0;border-radius:0;background:#fff url(/images/arr_down.svg) no-repeat 97% 50% / 24px;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:1.8rem}
#container .page_header .snb option{padding:10px 20px;font-weight:500}
#container .page_header .snb nav{display:none}

@media (min-width:1280px){
	#container{padding:40px 0 60px}
	#container .page_header{height:max(30vh, 380px)}
	.breadcumb{margin-bottom:20px}
	.breadcumb li{font-size:1.4rem}
	.breadcumb .home a{width:20px}

	#container .page_header .snb{bottom:0;height:fit-content}
	#container .page_header .snb select{display:none}
	#container .page_header .snb nav{display:flex;gap:60px;align-items:flex-end;justify-content:center}
	#container .page_header .snb nav a{padding:0 4px 16px;font-weight:400;color:#fff;font-size:2rem;position:relative;transition:width .3s ease;letter-spacing:0.5px}
	#container .page_header .snb nav a::after{content:'';display:block;width:0;height:4px;background:var(--color-gray05);position:absolute;left:50%;bottom:0;transform:translateX(-50%);transition:width .3s ease}
	#container .page_header .snb nav a.current::after,
	#container .page_header .snb nav a:hover::after,
	#container .page_header .snb nav a:focus::after{width:100%}	
}

#content{position:relative;display:flex;flex-direction:column;padding:60px 0;gap:50px;margin:0 auto;max-width:1020px;}
#content:has(.aside){max-width:1440px;}
#content .aside{padding-top:60px;border-top:2px solid var(--color-gray100)}

@media (min-width:1280px){
	#content{flex-direction:row;padding:80px 0;align-items:stretch}
	#content .content{flex:1;min-width:0;padding:30px 0 0}
	#content .aside{flex:0 0 calc( 320px + 50px);padding:0 0 0 50px;border-left:1px solid var(--color-gray30);border-top:0;min-width:0}
}

.content.sticky{}
.content.sticky .float_box{display:none}
.content.sticky .section{}

@media (min-width:1024px){
	.content.sticky{display:flex;gap:40px;align-items:flex-start}
	.content.sticky .float_box{display:block;flex:0 0 160px;position:sticky;left:0;top:120px}
	.content.sticky .section{}
}
@media (min-width:1600px){
	.content.sticky .float_box{flex:0 0 180px}
}
