﻿
@import url('notosanskr1.css');
/*@import url('fonts.css');*/
/*@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');*/

* {
	margin: 0;
	padding: 0;
	box-sizing:border-box;
	font-size:16px;
	font-family: 'Titillium Web', 'Noto Sans KR', sans-serif;
	/*font-family: 'Titillium Web','Nanum Gothic', sans-serif;*/
	letter-spacing:-0.05em;
}
/*
body, talbe, th, td, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
	pre, form, fieldset, textarea, blockquote, span, * {
	font-family: 'Nanum Gothic', sans-serif;
}
*/
html, body, div, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ul, ol, li, table, tr, th, td 등등
{
	margin: 0;
	padding: 0;
	min-width: min-content;
}
ol,ul {list-style: none;}
img {border: none;}
a{text-decoration:none;}
button{cursor:pointer;}
.wrapper{max-width:1240px; margin:0 auto}

/*wrapper 영역 안에 그리드 콘테이너 넣어서 디자인20231110*/

.wrapper .grid-container {
    display: grid;
    grid-template-rows: auto; auto;
    grid-template-columns: repeat(3, 1fr);
    justify-content: center;
    align-items: center;
}

.wrapper .grid_1 {
    grid-row: 1;
    grid-column: 1;
}

.wrapper .grid_2 {
    grid-row: 1;
    grid-column: 2;
}

.wrapper .grid_3 {
    grid-row: 1;
    grid-column: 3;
}

.wrapper .grid_4 {
    grid-row: 2;
    grid-column: 1;
}

.wrapper .grid_5 {
    grid-row: 2;
    grid-column: 2;
}

.wrapper .grid_6 {
    grid-row: 2;
    grid-column: 3;
}
/*여기까지20231110*/

.clearfix::after {
	content:'';
	display: block;
	clear: both;
}

.clearfix::after {
	content:'';
	display: block;
	clear: both;
}

input[type=checkbox]{
	display: inline-block;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-right:5px
}

/* ==== header ==== */
header{width:100%; height:161px; background:#fff; position:absolute; top:0; z-index:9999; border-bottom: 1px solid #244682;}
header #header_area{width:1240px; height:160px; margin:0 auto; position:relative; padding:25px 0 0;}
header #header_area .logo{
	position:relative
}

/* 검색바 */
header #header_area .search_box{
	width:620px;
	height:50px;
	position:absolute;
	top:30px;
	border-bottom:2px solid #1f208a;
	left:50%;
	margin-left:-310px;
}
header #header_area .search_box input{
	width:570px;
	height:100%;
	border:0;
	float:left;
	background:transparent;
	height: 48px;
	outline:none;
	font-size:19px;
	padding: 0 10px;
	box-sizing:border-box
}
header #header_area .search_box button{
	width:50px;
	height:50px;
	background:url('../image/search_icon.png') no-repeat center;
	border:0;
}
header .search_ul li a{
	display:inline-block;
	margin:3px 0;
	font-size:16px
}

/* 로그인 */
header #header_area .login{
	position:absolute;
	top:10px; right:0;
}
header #header_area .login a{
	display:inline-block;
	border:1px solid #1f208a;
	color:#1f208a;
	padding:1px 20px;
	border-radius:5px;
	transition:all 0.3s;
	font-size:18px
}
header #header_area .login a:hover{
	color:#fff;
	background-color:#1f208a;
}

/* 언어 */
header #header_area .lang{position:absolute; right:0; top:40px;}
header #header_area .lang ul li{float:left;}
header #header_area .lang ul li a{font-size:12px; color:#464646; font-weight:600;}
header #header_area .lang ul li:first-of-type{padding-right:20px; background:url('../image/lang_bar.png') no-repeat right;}
header #header_area .lang ul li:first-of-type a{color:#de2500;}
header #header_area .lang ul li:last-of-type{padding-left:20px;}

/* gnb */
header #header_area .gnb_menu{display:flex; justify-content:center; margin-top:35px;}
header #header_area .gnb_menu ul li{width:150px; float:left; text-align:center;}
header #header_area .gnb_menu ul li a{color:#464646; font-size:18px;}
header #header_area .gnb_menu ul li a:hover{color:#1f208a;}
header #sub_menu{
	width: 100%;
    background: rgba(36,70,130,0.9);
    border-top: 1px solid #e1e1e1;
    padding: 20px 0;
    float: left;
    position: absolute;
    top: 160px;
    display: none;
	
}
header #sub_menu > div{width:900px; margin:0 auto;}
header #sub_menu div ul{width:150px; float:left;}
header #sub_menu div ul li{text-align:center; margin-bottom:8px;}
header #sub_menu div ul li a{
	font-size: 15px;
    color: white;
    font-weight: 500;
	
}
header #sub_menu div ul li a:hover{color:#fff;}


.s_menu .on a{
  font-weight: 500;
  font-size:18px
}



/* 2018.09.03 상품정보 작업 이상승 */
.contents{ 
	min-height: 1000px;
    width: 100%;
    margin-top: 160px;
    float: left;
}
.contents table {
	width:1000px;
    border-collapse: collapse;
    margin:0 auto;
}

.contents table, th, td {
    border: 1px solid rgba(0,0,0,0.1);
}
.contents .record{ width:1240px; min-height:20px; margin:30px auto; margin-bottom: 5px;}
.contents .record ul li{ min-width:5%; text-align:center; float: left; border-right:1px solid gainsboro; padding:0 10px; margin-bottom:8px; font-size:15px}
.contents .record ul li:last-child{ border:none;}
.contents .record ul li a{ color: #454545; }
.contents .pls_btn{
	width: 100%;
	height: 50px;
	margin: 30px auto 60px;
	text-align: center;
}
.contents .pls_btn p{  
    display:inline-block;
    margin-right: 5px;
}
.contents .pls_btn a{
	color: #000;   
	border: 1px solid #ddd;
    width: 39px;
    height: 38px;
    display: inline-block;
    vertical-align:middle;
    transition:all 0.3s;
    font-size:20px;
    box-sizing:border-box
}

.contents h2,#contents h2{
    font-size: 20px;
    font-weight: normal;
    text-align: center;
    color: #464646;
	margin: 100px 0 30px;
}
.line_bar {
    background: #285b95;
    width: 40px;
    height: 2px;
    margin: -20px auto 50px auto;
}


.active_p{ color: #000 !important; border:3px solid #1f208a !important}

.prd_view{ width: 100%; min-height: 730px; }
.prd_view a{ float: right; float: right; font-size: 24px; font-weight: bold; color: #fff; margin-right: 15px;}
.prd_view .close{ height: 40px; background: #000; }
.prd_view .prd_popup{ width: 1194px; height: 240px; margin: 0 auto; position:relative; background: #663399; color: #fff; padding: 0 20px;}
.prd_view .prd_popup div{ float: left; height: 100%; margin: 20px 0; }
.prd_view .prd_popup div:nth-child(1){/* width: 20%; height: 195px; border: 2px solid #eee; */ }
.prd_view .prd_popup div:nth-child(2){ width: 90%; text-align:center; line-height: 100px;}
.prd_view .prd_popup div:nth-child(2) ul li{ float: left; width:25%;}
.prd_view .prd_popup div:nth-child(3){ width: 10%; text-align: right; }
.prd_view .prd_popup h2{
    font-size: 24px;
    font-weight: 600;
    position: relative;
    top: 15px;
}
.prd_view .prd_popup button{
	cursor: pointer;
    background: rgba(0,0,0,0.5);
	border:0;
    padding: 4px;
    width: 100px;
    border-radius: 5px;
	margin-right: 21px;
	color: #fff;
	margin: 5px auto; 
}
.black_cover{ background-color: rgb(49,49,48,0.9); z-index: 9999; width: 100%; height: 100%; position: fixed; top: 0;}

.prd_info{ width: 1100px; margin: 0 auto; }
.prd_info h2{ font-size: 18px; margin-bottom: 20px;}
.prd_info h2::before {
    display: inline-block;
    content: '';
    width: 12px;
    height: 12px;
    background-color: #285b95;
    margin-right: 10px;
    position: relative;
}
.prd_info ul{ margin-top:20px;}
.prd_info div{ width: 50%; float: left; }
.prd_info table tr td{
    border:none;
	height: 45px; 
}
.prd_info button{
	cursor: pointer;
    background: #4a5567;
	border:0;
    padding: 4px;
    width: 140px;
    border-radius: 5px;
	margin-right: 35px;
	color: #fff;
	height:45px
}


 .table_box tr::before{
	display:inline-block;
	vertical-align:middle;
	content:'';
	width:5px; height:5px;
	background-color:#285b95;
	border-radius:50%;
	position:relative;
	top:9px;
	margin-right:6px
}

/*
.table3_box tr::before{
	width:10px;
	height:2px;
	background-color:rgba(0,0,0,0.8);
	margin-left:60px;
	margin-right:15px;
	border-radius:0
}
*/
.table3_box tr td{
	position:relative;
	left:17px
}

.pop2_table1 tr::before{
	display:inline-block;
	vertical-align:middle;
	content:'';
	width:5px; height:5px;
	background-color:#285b95;
	border-radius:50%;
	position:relative;
	top:9px;
	margin-right:6px
}


/* 바로주문하기 */
.quick{
	width: 400px;
    height: 250px;
    position: fixed;
    background: #f6f6f6;
    top: 25%;
    left: 56%;
    padding: 18px;
    box-sizing: border-box;
    border-radius: 10px;
}
.quick .close{
    height: 30px;
}
.quick .close a{
    float: right; 
    font-size: 24px;
	font-weight: bold;
	color: #454545;
}
.quick .quick_table{
    width: 350px;
	margin: 20px auto;
	border: none;
}
.quick .quick_table tr td{
	border: none;
}
.quick button{
	cursor: pointer;
    background: #4a5567;
	border:0;
    padding: 4px;
    width: 100px;
    border-radius: 5px;
	margin-right: 21px;
	color: #fff;
}


/* 최근 본 상품 */
#recently_view_box {
    position: absolute;
    width: 160px;
    height: 350px;
    left: 60px;
    top: 600px;
    border : 1px solid #cccccc; 
    text-align: center;
    z-index:9999;
    background-color:white;
}

#recently_view_box div:nth-child(1) font {
    color:#ff6a6a;
    font-weight:bold;
    font-size:14px;
}

#recently_view_box .recently_view_product {
    width:100%;
    height:40%;
    margin-bottom:5px;
    border:1px solid #e8e8e8;
    cursor:pointer;
}

#recently_view_box .recently_view_nothing {
    width:100%;
    vertical-align:middle;
    border:none;    
    margin-bottom:5px;
    font-size:13px !important;
    font-weight:400;
    height:40px !important;
    background-color:#0a2658 !important;
   	line-height:40px;
   	color:#fff
}

#recently_view_box .page_btn {
    border : 1px solid #cccccc;
    background-color:#fff;
    padding-right : 5px;
    padding-left : 5px;
    color: #737373;
}

#recently_view_box #prev_recently {
    margin-right : 25px;
    
}

#recently_view_box #next_recently {
    margin-left : 25px;s
}

#recently_view_box .arrow{
    position:absolute;
    bottom:10px;
    width:100%
}



