@charset "utf-8";
/* @import url(setting.css); */

html,body {width:100%; height:100%; min-height:65rem; background:url('../images/main/bg_index.jpg');}

/* ============================== [ #header ] ========================================================================================== */
#util {width:100%; padding:0 0 0 1.6rem min-height:4.6rem; box-sizing:border-box; background:#34312d; z-index: 9; display:flex; align-items:center;}
#util a {font-size:1.4rem; font-weight:300; color:#fff; text-decoration:none; padding:.6rem 0 .7rem 0; display:flex; align-items:center;}
#util a:not(:last-child):after {content:''; width:1px; height:1.2rem; margin:0 1.6rem; top:1px; position:relative; background:#757371;}
#util a.aks:before {content:''; 
	/* width:4.4rem; height:2.7rem;  */
	/* background:url('../images/main/logo-aks.svg') no-repeat; background-size:4.4rem auto;  */
	width: 4.4rem; height:2.7rem;
	/* padding: 1rem 0 0 1rem; */
	background:url('../images/kdp-logo-small.svg') no-repeat; background-size:3.4rem auto; 
	background-position: center;
	padding-right:.5rem;}

/* ============================== [ #contents ] ========================================================================================== */
#contents {position:absolute; width:97rem; left:50%; top:50%; transform: translate(-50%, -44%);}
.title-wrap .logo {text-align:center;}
.title-wrap .logo img {width:46.4rem;}
.title-wrap .logo p {font-size:2.5rem; color:#434369; margin:1.2rem auto 6.5rem;}

/* search */
.search-wrap {display:flex; align-items:center; justify-content: center;}
.search-wrap .position-fixed {display:flex; align-items: center;}
.search-wrap .header-fixed-inner {height: 100%; z-index:200; margin:0 0 1.1rem;}


.search-wrap .header-nav {display:flex; flex-wrap:wrap; align-items: center; justify-content: center;}
.search-wrap .header-nav .search-option {display:flex; justify-content: center; width:100%; margin:0 0 2.1rem;}
.search-wrap .header-nav .search-option .item-checkbox label {position: relative; display: inline-flex; align-items: center; font-size: 1.6rem; color: #41435b; font-weight:500; letter-spacing:-0.03em; margin-left:1rem; position:relative; top:3px;}
.search-wrap .header-nav .search-option .item-checkbox input[type='radio'] + label:before {border:1px solid #b2b3b3; width:1.8rem; height:1.8rem; border-radius:.9rem; top: 1px;}
.search-wrap .header-nav .search-option .item-checkbox input[type=radio]:checked + label:before {border:1px solid #b2b3b3;}
.search-wrap .header-nav .search-option .item-checkbox input[type=radio]:checked + label:after {top: .6rem; left: .9rem;}
.search-wrap .header-nav .search-form {width:65.5rem; height:7.3rem; border-radius:3.5rem; box-sizing: border-box; background:#434369;}
.search-wrap .header-nav .search-form .box {display: flex; align-items: center; padding: 0 0 0 2.3rem;}
.search-wrap .header-nav .search-form .box .select {flex-shrink: 0; position: relative; width:auto; margin:1px 1.9rem 0 0;}
.search-wrap .header-nav .search-form .box .select select {border:none; font-size:1.6rem; width:11rem; height:6.7rem; margin-top:2px; color:#fff; background: #434369 url('../images/ico_dropdown_w.svg') right 8px center/9px no-repeat; font-weight:400;}
.search-wrap .header-nav .search-form .box .input-wrap {display: flex; align-items: center; justify-content: space-between; width: 100%;}
.search-wrap .header-nav .search-form .box label {width: 100%;}
.search-wrap .header-nav .search-form .box input[type=text] {width: calc(100% - 2rem); background: #434369; height:6.7rem; border: 0; padding: 0; margin: 2px 0 0 0; color:#fff; font-size: 1.6rem; font-weight:400;}
.search-wrap .header-nav .search-form .box input[type=text]::placeholder {color:rgba(255,255,255,.5)} /*240703*/
.search-wrap .header-nav .search-form .box .btn-wrap {flex-shrink: 0; display: flex; align-items: center;}
.search-wrap .header-nav .search-form .box .btn-wrap a {position: relative; display: block; padding: 1rem;}
.search-wrap .header-nav .search-form .box .btn-wrap a img {width: 1.9rem;}
.search-wrap .header-nav .search-form .box .btn-wrap a:after {content: ''; position: absolute; top: 50%; right: 0; width: 1px; height: 1.5rem; transform: translateY(-50%); background-color: #646468;}
.search-wrap .header-nav .search-form .box .btn-wrap button {display: block; padding: 1rem 3rem 1rem 1rem; cursor: pointer; background:transparent;}
.search-wrap .header-nav .search-form .box .btn-wrap button img {width: 1.9rem; filter: invert(100%);}

.search-wrap .header-nav .search-add {display:flex;}
.search-wrap .header-nav .search-add a {display: flex; align-items: center; justify-content: center; height:7.3rem; border-radius:3.5rem; box-sizing: border-box; border:2px solid rgba(67,67,105,1); background:#fff; margin:0 0 0 .3rem;}
.search-wrap .header-nav .search-add a:hover {background:#f5f5f5; transition: all .4s;}
.search-wrap .header-nav .search-add a span {display: flex; align-items: center; margin: 0 1.2rem 0 1rem; text-align: center; font-size: 1.6rem; letter-spacing: -.065rem; color: #000; font-weight:400;}
.search-wrap .header-nav .search-add a span:before {content:''; width:2.3rem; height:2.3rem; background:url(../images/ico_input_font.svg) center no-repeat; background-size:2.3rem auto; filter: invert(25%) sepia(20%) saturate(1037%) hue-rotate(202deg) brightness(97%) contrast(91%); margin:0 .5rem 0 0; border-radius:1.1rem;}
.search-wrap .header-nav .search-add a.font_download span:before {background:url(../images/ico_font.svg) center no-repeat; background-size:2.3rem auto;}

/* button */
.menu-wrap {display:flex; align-items:flex-start; margin:4rem 2rem 7.5rem; word-break:keep-all;}
.menu-wrap .menu {padding:1.6rem 4rem; display:flex; flex-wrap:wrap; text-align:center; text-decoration:none; position:relative; width:50%;}
.menu-wrap .menu a {white-space:nowrap;}
.menu-wrap .menu:not(:last-child):after {content:''; position:absolute; right:0; top:0; width:1px; height:14rem; background:url(../images/main/dot.png) repeat-y; background-size:1px auto; display:block;}
.menu-wrap .menu .btn-title {font-size:2.4rem; color:#c20000; font-weight:300; letter-spacing:-0.02em; line-height:1.2; text-align:center; margin:0 auto .9rem; display:flex; flex-wrap:wrap; align-items:center;}
.menu-wrap .menu .btn-title b {font-weight:600; color:#434369; margin-right:.6rem; line-height:1.2;}
.menu-wrap .menu .btn-title:before {content:''; display:block;}
.menu-wrap .menu:nth-child(1) {padding-left:0;}
.menu-wrap .menu:nth-child(2) {padding-right:0;}
.menu-wrap .menu:nth-child(1) .btn-title:before {width:4.8rem; height:3rem; background:url(../images/main/icon-book.svg) no-repeat; background-size:4.8rem auto; margin-right:.8rem;}
.menu-wrap .menu:nth-child(2) .btn-title:before {width:2.8rem; height:2.9rem; background:url(../images/main/icon-dic.svg) no-repeat; background-size:2.8rem auto; margin-right:1.2rem;}
.menu-wrap .menu .btn-exp {color:#666; line-height:1.2; font-size:1.5rem; border-top:1px solid #dbdbdb; line-height:1.4; display:block; width:100%; padding-top:2rem;}
.menu-wrap .cate {display:flex; margin:0 auto;}
.menu-wrap .cate li {display:flex; align-items:center;}
.menu-wrap .cate li a {display:flex; align-items:center; height:4rem; font-size:1.7rem; color:#434369; font-weight:600;}
.menu-wrap .cate li a:hover {color:rgba(0,0,0,.4); transition: all .3s;}
.menu-wrap .cate li:not(:last-child):after {content:''; margin:0 1.5rem; width:.3rem; height:.3rem; border-radius:.2rem; background:#434369; display:block;}

/* ============================== [ #footer ] ========================================================================================== */
.footer-wrap {text-align:center; font-size:1.3rem; word-break:keep-all;}
.footer-wrap .tel {padding-left:2.4rem;}
.footer-wrap:before {content:''; display:block; width:16.8rem; height:3.5rem; margin:0 auto 6.2rem; background:url('../images/main/logo-amb.png') no-repeat; background-size:16.8rem auto;}
.footer-wrap b { font-weight:700;}


@media only screen and (max-height:900px){		
	#contents {transform: translate(-50%, -45%);}
	.title-wrap .logo:before {display:none;}
	.title-wrap .logo img {width:39rem;}
	.title-wrap .logo p {margin: 1.3rem auto 4.5rem;}
	.menu-wrap {margin:5rem 0 5rem;}
}

@media only screen and (max-width:1024px){	
	/* ============================== [ #contents ] ========================================================================================== */
	#contents {width:calc(100% - 2rem);}
	.title-wrap .logo img {width:40rem;}
	.title-wrap .logo p {font-size:2.5rem;}	
	
	.search-wrap .header-nav .search-form {width:55rem;}
	
}

@media only screen and (max-width:767px){	
	/* ============================== [ #header ] ========================================================================================== */
	#util {justify-content:center;}
	
	/* ============================== [ #contents ] ========================================================================================== */
	#contents {width:calc(100% - 20px);transform: translate(-50%, 0); top:13rem;}
	.title-wrap .logo img {width:25rem;}
	.title-wrap .logo p {font-size:17px; font-weight:500; margin:0 auto 5rem;}
	
	/* search */
	.search-wrap .header-nav .search-form {width:100%; height:5.6rem; border-radius:2.8rem;}
	.search-wrap .header-nav .search-form .box {padding: 0 0 0 1.3rem;}
	.search-wrap .header-nav .search-form .box .select {margin:1px 1rem 0 0;}
	.search-wrap .header-nav .search-form .box .select select {font-size:1.4rem; width:11rem; height:4.9rem;}
	.search-wrap .header-nav .search-form .box input[type=text] {width: 100%; height:4.9rem; font-size: 1.5rem;}
	
	.search-wrap .header-nav .search-add {display: flex; width:100%;}
	.search-wrap .header-nav .search-add a {width:100%; height:4.8rem; border-radius:2.2rem; margin:.6rem .3rem;}
	
	/* button */
	.menu-wrap {align-items:center; flex-wrap:wrap; margin:3rem 1rem 5rem;}
	.menu-wrap .menu {padding:1.6rem 0; flex-wrap:wrap; width:100%;}
	.menu-wrap .menu:not(:last-child):after {display:none;}

	/* ============================== [ #footer ] ========================================================================================== */
	.footer-wrap {font-size:11px;}
	.footer-wrap .tel {display:block; padding-left:0;}
	.footer-wrap br {display:none;}
	.footer-wrap:before {width:100px; height:25px; margin:0 auto 15px; background:url('../images/main/logo-amb.png') no-repeat; background-size:100px auto;}
}