.sub-top {margin-top:100px;}


.sub-top strong {
	display: block;
	padding: 70px 0 40px;
	font-size: var(--font-sub-title);
	font-weight: normal;
	text-align: center;
	line-height: 1;
}

.sub-top p {
	margin: 42px auto 5px;
	font-size: var(--font-medium);
	text-align: center;
	opacity: 0.9;
	word-break: keep-all;
}
.sub-top h5 {
	display: block;
	padding-bottom: 60px;
	font-size: var(--font-large);
	text-align: center;
	border-bottom: 1px solid rgba(18, 18, 18, 0.5);
}



.sub-top {
	width: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.sub-top .sub-cate {
	color: var(--white-color);
	font-size: var(--font-sv-title);
}

.sub-top .sec-in {
	padding: 150px 0 100px;
}

.sub .sec-in {
	padding: 0 0 150px;
}
.sub .top .sec-in {
	padding: 130px 0 90px;
}

.sub .top { text-align: left; }




.sub-cate-en {
	display: block;
	margin-bottom: 10px;
	font-size: var(--font-basic);
    font-weight: 600;
    color: var(--tertiary-color);
    letter-spacing: 0.005em;
	text-align: center;
}
.sub-cate {
	font-size: var(--font-sub-title);
	font-weight: 600;
	color: var(--white-color);
	line-height: 1;
    letter-spacing: -0.03em;
}

.sub-title {
	display: block;
	margin-bottom: 25px;
	font-size: var(--font-sec-title);
	font-weight: 700;
	line-height: 1.1;
	color: var(--black-color);
	letter-spacing: -0.01em;
}
.sub-title strong {
	font-weight: 700;
}
.sub-title .ls-0 {
	letter-spacing: 0em;
}
.sub-title-content {
	font-size: var(--font-s-title);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.63px;
	word-break: keep-all;
}
.sub-title-content span { color: var(--primary-color); }


.sub-m-txt {
	margin-bottom: 16px;
	font-size: var(--font-sec-text);
	font-weight: 500;
	line-height: 1.2;
}
.sub-txt {
	margin-bottom: 50px;
	font-size: var(--font-basic);
	font-weight: 400;
	line-height: 1.5;
}
.sub-txt span {
	display: block;
}

#about .top img, .top .sub-cate {
	margin-bottom: 50px;
}

/************************** about **************************/

#top_about { background-image: url(../img/sub/sub-top01.jpg); }



#about .sec-1 .con1 {position: relative; }
/*
#about .sec-1 .con1 .img-wrap {	width: 100%; height: 500px;	position: relative;	border-radius: 20px; overflow: hidden;
	background: url(/img/sub/about-sec1.jpg) no-repeat center center / cover; }*/



/* 이미지 어둡게 *//*
#about .sec-1 .con1 .img-wrap::after{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.15);
}*/

#about .sec-1 .con1 .img-wrap {
	width: 100%;
	height: 500px;
	position: relative;
	border-radius: 20px;
	overflow: hidden;

	background-image: url(/img/sub/about-sec1.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
}

#about .sec-1 .con1 .img-wrap::after {
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.15);
	z-index:1;
}

#about .sec-1 .con1 .txt-wrap {
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	z-index:2;
	text-align:center;
	width:100%;
}

#about .sec-1 .con1 .head-title{
	font-size: var(--font-s-title);
	font-weight:700;
	color:#fff;
	line-height:1.2;
	letter-spacing:-0.03em;
	margin:0;
	padding:0;

	opacity: 0;
	transform: translateY(40px);
	transition: all 1.4s;
}

#about .sec-1 .con1 .head-title.active{
	opacity: 1;
	transform: translateY(0);
}

#about .sec-1 .con1 .head-title span{ display:block; margin-top:10px; color:#fff; }


#about .sec-2 .sec-in { display: flex; }
#about .sec-2 .sec-in > div { width: 45%; }
#about .sec-2 .sec-in > div+div { width: 55%; }
#about .sec-2 .sec-in .con1 ul li { display: flex; padding: 24px 0 24px 5px; border-top:1px solid #d3d3d3; border-right-width: 0px; border-left-width: 0px; font-size: var(--font-basic1); }
#about .sec-2 .sec-in .con1 ul li:last-child { border-bottom:1px solid #d3d3d3; }
#about .sec-2 .sec-in .con1 ul li span { display: inline-block; min-width: 145px; font-weight: 700;  }

#about .sec-3 { background: #f6f6f6; }
#about .sec-3 .sec-in { padding:130px 0; }
#about .sec-3 .sub-title{ text-align: center; }
#about .sec-3 .service-wrap {
	display: flex;
	flex-direction: column;
	gap: 190px;
	margin-top: 100px;
}

#about .sec-3 .service-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap:120px;
}

#about .sec-3 .service-box.reverse {
	flex-direction: row-reverse;
}

#about .sec-3 .txt-box {
	width: 50%;
}

#about .sec-3 .img-box {
	position: relative;
	width: 50%;
	border-radius: 20px;
	overflow: hidden;
}

#about .sec-3 .img-box img {
	display: block;
	width: 100%;
}

#about .sec-3 .txt-box h3 {
	margin-bottom: 20px;
	padding-bottom: 17px;
	font-size: var(--font-sec-title);
	font-weight: 700;
	border-bottom: 1px solid #ddd;
}

#about .sec-3 .txt-box p {
	margin-bottom: 30px;
	padding-bottom: 20px;
	line-height: 1.7;
	color: #666;
	font-size: var(--font-basic1);
}

#about .sec-3 .txt-box ul li {
	position: relative;
	display: flex;
	gap:10px;
	margin-bottom: 14px;
	font-size: var(--font-basic);
}
#about .swiper-nav {
	position: absolute;
	left: 50%;
	bottom: 28px;
	transform: translateX(-50%);
	z-index: 10;

	display: flex;
	align-items: center;
	gap: 16px;
}

#about .sec-3 .prev,
#about .sec-3 .next {position: static !important;width: 18px;height: 18px;margin: 0;color: #fff;}

#about .sec-3 .prev::after,
#about .sec-3 .next::after {font-size: 20px;font-weight: 300;}

#about .sec-3 .check-icon {
	position: relative;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #243582;
	flex-shrink: 0;
}

#about .sec-3 .check-icon::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 8px;
	height: 5px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: translate(-50%, -60%) rotate(-45deg);
}

#about .sec-4 .sec-in { padding:130px 0; }
#about .sec-4 .sub-title { color:var(--font-sec-title); }
#about .sec-4 .top-area { margin-bottom: 60px;}
#about .sec-4 .txt-box p {margin-bottom: 40px;font-size: var(--font-basic1);line-height: 1.8;color: #555;}

#about .sec-4 .btn-wrap { justify-content: unset; }
#about .sec-4 .btn-wrap a { border: 1px solid #000; color: #000; text-align: left; }
#about .sec-4 .btn-wrap a:hover { background-color: var(--primary-color, #c4242e); color: rgb(255, 255, 255); border: 1px solid var(--primary-color, #c4242e); }

#about .sec-4 .strength-list { display: flex; gap: 30px; }
#about .sec-4 .strength-box { position: relative; flex: 1; height: 300px; overflow: hidden; border-radius: 20px; }
#about .sec-4 .strength-box img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
#about .sec-4 .strength-box:hover img { transform: scale(1.08); }
#about .sec-4 .strength-box .overlay { position: absolute; inset: 0; background: rgba(36,53,130,.85); }
#about .sec-4 .strength-box .txt { position: absolute; top: 36px; left: 48px; right: 30px; color: #fff; z-index: 2; }
#about .sec-4 .strength-box .txt strong { display: block; margin-bottom: 13px; font-size: var(--font-medium2); font-weight: 500; }
#about .sec-4 .strength-box .txt h3 { margin-bottom: 25px; font-size: var(--font-sv-title); line-height: 1; font-weight: 600; }
#about .sec-4 .strength-box .txt p { font-size: var(--font-basic); font-weight: 500; }

#about .sec-4 .btn-wrap { gap: 15px; }
#about .sec-4 .btn-wrap a { width: 220px; text-align: left;}
/************************** about **************************/


/************************** about history**************************/
#top_history { background-image: url(../img/sub/sub-top01.jpg); }

#about_history .sec-1 {background: #fff;}
#about_history .sec-1 .con1 { display: flex; align-items: flex-start;  }
#about_history .sec-1 .img-box { max-width: 663px; border-radius: 20px; overflow: hidden; position: sticky; top: 120px; overflow: hidden; }
#about_history .sec-1 .img-box img { display: block; width: 100%;  border-radius: 20px; }
#about_history .sec-1 .history-list { position: relative; margin-left: 150px; height: 100%; }
#about_history .sec-1 .history-list .year:before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: var(--primary-color);
	border-radius: 50%;
	border: 5px solid #d1e0fe;
	position: absolute;
	top: 25%;
	left: -9px;
	transform: translateY(-52%);
	z-index: 1;
}
#about_history .sec-1 .history-list li {
	margin: 0 0 64px;
	padding: 12px 0 0 70px;
	font-weight: 300;
}
#about_history .sec-1 .history-list .year {
	font-size: var(--font-m-sec-txt2) ;
	font-weight: 700;
	margin-bottom: 35px;
}
#about_history .sec-1 .history-list p:not(.year) {
	position: relative;
	font-size: var(--font-basic1) ;
	line-height: 1.6;
	color: #333;
	word-break: keep-all;
	padding: 16px 0;
}
#about_history .sec-1 .history-list p:not(.year) span {
	display: inline-block;
	min-width: 70px;
	font-weight: 700;
}
#about_history .sec-1 .history-list p:not(.year) span:before {
	content: "";
	display: inline-block;
	width: 4px;
	height: 4px;
	background: #103086;
	border-radius: 50%;
	vertical-align: middle;
	margin-top: -2px;
	margin-right: 10px;
}
#about_history .sec-1 .history-list::after {
	content: "";
	position: absolute;
	top: 0;
	width: 1px;
	height: 100%;
	background: #d9dee5;
}
#about_history .sec-1 .history-list .list-area > ul {
	position: relative;
}
#about_history .sec-1 .history-list .list-area > ul::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	font-size: 60px;
	font-weight: 800;
	letter-spacing: 2px;
}
#about_history .sec-1 .history-list ul:after {
	content: "";
	display: block;
	clear: both;
}

/************************** about history**************************/


/************************** support **************************/
#top_support { background-image: url(../img/sub/sub-top02.jpg); }

/************************** support **************************/

/************************** product **************************/
#top_product { background-image: url(../img/sub/sub-top03.jpg); }

#product .product-wrap{ width:100%; }
#product .product-list{ display:flex; flex-wrap:wrap; gap:50px 40px; padding:0; margin:0; list-style:none; }
#product .product-list li{ width:calc((100% - 120px) / 4); }
#product .product-list li a{ display:block; text-decoration:none; color:#000; }
#product .product-list .thumb{ width:100%; aspect-ratio:1 / 1; overflow:hidden; border:1px solid #ddd; border-radius: 15px; }
#product .product-list .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
#product .product-list p{ margin-top:20px; font-size:18px; font-weight:500; line-height:1.4; }

#product .product-detail-wrap{width:100%;margin:0 auto;}
#product .product-detail-top{display:flex;gap:100px;padding-bottom: 70px;}
#product .product-img{width:50%;max-width:525px;aspect-ratio:500/500;overflow:hidden;border:1px solid #ddd; border-radius: 15px;}
#product .product-img img{display:block;width:100%;height:100%;object-fit:cover;}
#product .product-info{flex:1;}
#product .product-info h3{margin:0;padding-bottom:28px;border-bottom:1px solid #111;font-size:40px;font-weight:600;line-height:1.4;}
#product .order-box{margin-top:124px;padding:0 10px;}
#product .qty-row{display:flex;align-items:center;gap:40px;padding-bottom:30px;border-bottom:1px solid #ddd;}
#product .qty-row > span{font-size:16px;}
#product .qty-control{display:flex;align-items:center;gap:8px;}
#product .qty-control button{width:30px;height:32px;background:#969696;color:#fff;font-size:20px;cursor:pointer;}
#product .qty-control input{width:60px;height:32px;border:1px solid #d3d3d3;text-align:center;font-size:16px;}
#product .order-btn{display:flex;align-items:center;justify-content:center;width:273px;height:68px;margin-top:30px;background:var(--primary-color);color:#fff;font-size:18px;text-decoration:none;}
#product .product-detail-content{min-height:300px;padding:150px 20px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;font-size:18px;}
#product .product-detail-bottom{display:flex;justify-content:center;padding:70px 0;}
#product .list-btn{display:flex;align-items:center;justify-content:center;width:140px;height:50px;background:#969696;color:#fff;font-size:18px;text-decoration:none;transition:.3s;}
#product .list-btn:hover{ border: 1px solid #969696; background: #fff; color: #969696; }

/************************** product **************************/

/************************** insurance **************************/
#top_insurance { background-image: url(../img/sub/sub-top04.jpg); }

#insu_consult .con2 ul { display: flex; justify-content: center; gap: 50px; }

/************************** insu-consult **************************/

#insu_consult .top { margin-bottom:50px; }

#insu_consult .con2 { background: #E6ECF9; border-radius: 20px; padding:90px 50px; margin-top: 80px; }
#insu_consult .con2 .tlt { text-align: center; margin-bottom: 50px; font-size: var(--font-sec-title); font-weight: 700 }

#insu_consult .etc-con { padding-bottom: 20px; }
#insu_consult .etc-con .etc1 { font-size: var(--font-medium); font-weight: 500; line-height: 1.3; padding-bottom: 10px; }
#insu_consult .etc-con .etc2 { font-size: var(--font-basic); font-weight: 300; padding-bottom: 20px; color: #666; }

#insu_consult .sec-1 .contents { margin-bottom: 50px;  padding: 45px 60px 0px 60px; border-radius: 15px; background: #F4F4F4; }
#insu_consult .sec-1 .contents ul { display: flex; }
#insu_consult .sec-1 .contents ul li { display: flex; padding: 0 20px 35px 0; font-size: var(--font-basic1); text-align: left;  }
#insu_consult .sec-1 .contents ul li:first-child { padding-left:0;}
#insu_consult .sec-1 .contents ul li:not(:last-child) { margin-right:50px; }
#insu_consult .sec-1 .contents ul li span {display:inline-block;min-width: 120px;font-weight: bold;line-height: 1.3;color: #333;text-align: left;word-break: keep-all;padding-bottom: 12px;}

#insu_consult .agree-wrap {margin-top: 50px;}
/************************** insu-consult **************************/

/************************** insu-corporate **************************/
#insu_corporate .agree-wrap {margin-top: 50px;}
/************************** insu-corporate **************************/

/************************** contact **************************/
#top_contact { background-image: url(../img/sub/sub-top05.jpg); }

/************************** contact **************************/
/************************** location **************************/

#page_location .sec-1 .con1 > div { text-align: center; padding-top: 50px; }
#page_location .sec-1 .con1 > div .head-title { font-size: var(--font-sec-title); font-weight:700; margin-bottom:2.1em; padding-top:22px;  }

#page_location .sec-1 .contents { padding: 45px 60px 0px 60px; border-radius: 15px; background: #F4F4F4; }

#page_location .sec-1 .contents ul { display: flex; }
#page_location .sec-1 .contents ul li { display: flex; padding: 0 20px 35px 0; font-size: var(--font-basic1); text-align: left;  }
#page_location .sec-1 .contents ul li:first-child { padding-left:0;}
#page_location .sec-1 .contents ul li:not(:last-child) { margin-right:50px; }
#page_location .sec-1 .contents ul li span {
	display:inline-block;
	min-width: 120px;
	font-weight: bold;
	line-height: 1.3;
	color: #333;
	text-align: left;
	word-break: keep-all;
	padding-bottom: 12px;
}

#page_location .sec-1 .map > div { width:100%; }
#page_location .sec-1 .map .cont { display:none; }

/************************** mypage **************************/
.mypage-wrap {
	display: flex;
	gap: 26px;
	margin: 0 auto;
	padding: 40px 20px;
	margin-top: 100px;
	margin-bottom: 100px;
}

.mypage-wrap .mypage-side {
	flex: 0 0 220px;
	padding-right: 30px;
	border-right: 1px solid #e5e5e5;
}

.mypage-wrap .mypage-side strong {
	display: block;
	margin-bottom: 20px;
	font-size: 16px;
	color: #222;
}

.mypage-wrap .mypage-side a {
	display: block;
	margin-bottom: 18px;
	font-size: 15px;
	color: #222;
	text-decoration: none;
}

.mypage-wrap .mypage-side a.on {
	color: #1f2aa5;
	font-weight: 700;
}

.mypage-wrap .mypage-content {
	flex: 1;
}

.mypage-wrap .mypage-content h2 {
	margin: 0 0 20px;
	font-size: 32px;
	font-weight: 800;
	color: #1d1d27;
}

.mypage-wrap .mypage-search {
	margin-bottom: 24px;
}

.mypage-wrap .search-row {
	display: flex;
	gap: 10px;
}

.mypage-wrap .date-range {
	display: flex;
	align-items: center;
	gap: 8px;
}

.mypage-wrap .date-range input,
.mypage-wrap .search-row select,
.mypage-wrap .search-row input[type="text"] {
	height: 46px;
	padding: 0 12px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 14px;
	box-sizing: border-box;
}

.mypage-wrap .date-range input {
	width: 150px;
}

.mypage-wrap .search-row select {
	width: 130px;
	padding: 0 40px 0 12px;
	background: #fff url("../img/down.png") no-repeat right 14px center;
	background-size: 12px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.mypage-wrap .search-row input[type="text"] {
	flex: 1;
	min-width: 250px;
}

.mypage-wrap .search-row button {
	width: 90px;
	height: 46px;
	border: 0;
	border-radius: 5px;
	background: #24348f;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.mypage-wrap .card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}

.mypage-wrap .status {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 28px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
}

.mypage-wrap .status.receipt { background: #00a9df; }
.mypage-wrap .status.progress { background: #24348f; }
.mypage-wrap .status.complete { background: #28a745; }
.mypage-wrap .status.cancel { background: red; }

.mypage-wrap .date {
	font-size: 14px;
	color: #666;
}

.mypage-wrap .desc {
	display: -webkit-box;
	margin: 0;
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	word-break: keep-all;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.mypage-wrap .empty-box {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 300px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	font-size: 15px;
	color: #666;
}

/* ==============================
   뷰페이지 공용
============================== */
.mypage-wrap .view-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 18px;
	padding-bottom: 18px;
	border-bottom: 1px solid #ddd;
}

.mypage-wrap .view-head .date {
	font-size: 14px;
	color: #666;
}

.mypage-wrap .view-table {
	border-top: 1px solid #ddd;
}

.mypage-wrap .view-row {
	display: grid;
	grid-template-columns: 140px 1fr 140px 1fr;
	border-bottom: 1px solid #ddd;
}

.mypage-wrap .view-th,
.mypage-wrap .view-td {
	min-height: 54px;
	padding: 16px 18px;
	font-size: 14px;
	line-height: 1.6;
	box-sizing: border-box;
}

.mypage-wrap .view-th {
	display: flex;
	align-items: center;
	background: #f8f8f8;
	color: #111;
	font-weight: 700;
}

.mypage-wrap .view-td {
	color: #333;
}

.mypage-wrap .view-td.full {
	grid-column: span 3;
}

.mypage-wrap .view-subject {
	margin: 46px 0 14px;
	font-size: 18px;
	font-weight: 800;
	color: #111;
}

.mypage-wrap .view-btns {
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.mypage-wrap .btn-list {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 90px;
	height: 42px;
	padding: 0 20px;
	border-radius: 5px;
	background: #24348f;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}

.mypage-wrap .btn-list:hover {
	opacity: .9;
}


/* ==============================
   A/S 리스트 전용
============================== */
.mypage-wrap .as-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.mypage-wrap .as-card {
	display: block;
	padding: 22px 28px;
	border: 1px solid #ddd;
	border-radius: 8px;
	color: #111;
	text-decoration: none;
	transition: all .2s ease;
}

.mypage-wrap .as-card:hover {
	border-color: #1f2aa5;
	box-shadow: 0 4px 16px rgba(0,0,0,.05);
}

.mypage-wrap .as-body {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 16px;
}

.mypage-wrap .as-body .info {
	flex: 1;
}

.mypage-wrap .as-body .info strong {
	display: block;
	margin-bottom: 6px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
}

.mypage-wrap .as-body .info p {
	margin: 0;
	font-size: 14px;
	color: #666;
	line-height: 1.5;
}

.mypage-wrap .as-body .meta {
	flex: 0 0 180px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: 14px;
	color: #666;
	text-align: right;
	line-height: 1.5;
}

/* ==============================
   A/S 뷰페이지 전용
============================== */
.mypage-wrap .as-view-page .view-head {
	/* 필요 시 A/S 전용 스타일 추가 */
}

/* ==============================
   주문내역 리스트 전용
============================== */
.mypage-wrap .order-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.mypage-wrap .order-card {
	display: flex;
	gap: 20px;
	padding: 22px 28px;
	border: 1px solid #ddd;
	border-radius: 8px;
	color: #111;
	text-decoration: none;
	transition: all .2s ease;
}

.mypage-wrap .order-card:hover {
	border-color: #1f2aa5;
	box-shadow: 0 4px 16px rgba(0,0,0,.05);
}

.mypage-wrap .order-thumb {
	flex: 0 0 120px;
	width: 120px;
	height: 120px;
	border: 1px solid #eee;
	border-radius: 6px;
	overflow: hidden;
	background: #f8f8f8;
}

.mypage-wrap .order-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mypage-wrap .order-info {
	flex: 1;
	min-width: 0;
}

.mypage-wrap .order-title {
	display: block;
	margin-bottom: 8px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
}

.mypage-wrap .order-option {
	margin: 0 0 12px;
	font-size: 14px;
	color: #666;
}

/* ==============================
   주문내역 뷰페이지 전용
============================== */
.mypage-wrap .order-view-head {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 22px;
	padding: 22px 24px;
	border: 1px solid #ddd;
	border-radius: 8px;
}

.mypage-wrap .order-view-thumb {
	flex: 0 0 110px;
	width: 110px;
	height: 110px;
	border: 1px solid #eee;
	border-radius: 6px;
	overflow: hidden;
	background: #f8f8f8;
}

.mypage-wrap .order-view-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mypage-wrap .order-view-info {
	flex: 1;
	min-width: 0;
}

.mypage-wrap .order-view-info .status {
	margin-bottom: 12px;
}

.mypage-wrap .order-view-info strong {
	display: block;
	margin-bottom: 8px;
	font-size: 20px;
	font-weight: 700;
	color: #111;
}

.mypage-wrap .order-view-info p {
	margin: 0;
	font-size: 14px;
	color: #666;
}

.mypage-wrap .order-view-head .date {
	flex: 0 0 auto;
	font-size: 14px;
	color: #666;
}



/************************** privacy **************************/
#privacy {
	padding-top: 150px;
}
#privacy .wrap-in {
	margin: auto;
	border-bottom: 1px solid #ddd;
}
#privacy .title {
	margin-bottom: 50px;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
}
#privacy h3 {
	display: block;
	margin-bottom: 50px;
	font-size: var(--font-smaller);
	font-weight: 500;
	line-height: 1.6;
}
#privacy li {
	margin-bottom: 50px;
	font-size: var(--font-smaller);
	line-height: 1.6;
}
#privacy ul li > div {
	margin-bottom: 30px;
}
#privacy li strong {
	display: block;
}
#privacy li p:nth-child(2) {
	margin-top: 5px;
}
/************************** privacy **************************/


/************************** 기본 폼 **************************/
.default-form .agree-tit {color: #222; font-size: 20px; letter-spacing: -0.5px; font-weight: 500; padding-bottom: 15px; }

.default-form .agree-check { padding-top: 15px; }

.default-form .inquiry-agreement-con { height: 85px; overflow-y: auto; overflow-x: hidden; padding: 20px; background-color: #f6f6f6; box-sizing: border-box; font-size: 14px; color: #686868; line-height: 1.7; }
.default-form .inquiry-agreement-con .sec-in { padding-top: 0; padding-bottom: 0; width:100% !important; }
.default-form .inquiry-agreement-con h3, .default-form .inquiry-agreement-con p { word-break: break-all }


.default-form .form > li { display: flex; align-items: center; width: 100%; padding: 25px 15px; box-sizing: border-box; border-top: 1px solid #e9e9e9; }
.default-form .form > li+li span > span { margin-left:25px;  }

.default-form .form > li:last-child { border-bottom: 1px solid #e9e9e9; }
.default-form .form > li:nth-child(odd) { margin-right: 40px; }
.default-form .form > li > span { position: relative; display: inline-block; min-width: 200px; font-size: var(--font-subtitle1); font-weight: 600; }
.default-form .form > li span span { display: inline-block; margin-left: 8px; position: absolute; top: 0; font-size: 18px; color: var(--primary-color); }

.default-form .form > li input[type='radio'] { width: 17px; height: 17px; background-color: initial; cursor: default; appearance: auto; box-sizing: border-box; margin: -2px 3px 0px 5px; padding: initial; border: initial; cursor: pointer; }
.default-form form input[type='radio'] + label { padding-right: 8px; }

.default-form form input[type='radio'] + label,
.default-form form input[type='checkbox'],
.default-form form input[type='checkbox'] + label { cursor: pointer; }

.default-form .form > li input[type='text'],
.default-form .form > li input[type='password'],
.default-form .form > li textarea { width: 100%; height: 54px; box-sizing: border-box; padding: 10px; font-size: var(--font-subtitle1); border: none; background: var(--white-color); border: 1px solid var(--border-color); border-radius: 5px;
}
.default-form .form > li input[type='text']::placeholder,
.default-form .form > li textarea::placeholder { color: #bbbbbb; }
.default-form .form > li textarea { height:200px; }

.default-form .form .radio-wrap li { position: relative; cursor: pointer; }
.default-form .radio-wrap { width: 100%; gap: 10px; }


.default-form .address button, .default-form .file-btn input[type=file]::file-selector-button {
	margin-left: 10px;
	width: 150px;
	height: 54px;
	line-height: 54px;
	font-size: var(--font-body1);
	color: var(--white-color);
	text-align: center;
	background: var(--black-color);
	border-radius: 5px;
}
.default-form .file-btn input[type=file]::file-selector-button { margin-left: 0; }
.default-form .form > li .address input { max-width: 100%; }

.default-form .form > li.jumin .jumin_wrap{ width:100%; display:flex; align-items:center; gap:6px; }
.default-form .form > li.jumin .jumin_wrap input[type='text'],
.default-form .form > li.jumin .jumin_wrap input[type='password']{ width:250px; flex:none; }
.default-form .form > li.jumin .jumin_wrap em{ flex:0 0 auto; font-style:normal; color:#222; font-size:18px; }
.default-form .form > li .address { width: 100%; }
.default-form .form > li .address .flex {margin-bottom: 10px;}

.default-form .form > li .date_wrap{ width:100%; display:flex; align-items:center; gap:6px; }
.default-form .form > li .date_wrap em{ flex:0 0 auto; font-style:normal; color:#222; font-size:18px; }
.default-form .yyyymmdd { width: 150px !important; }
.default-form .hour, .default-form .minute { width: 50px !important; }

.default-form select {
	width: 100%;
	height: 54px;
	padding: 0 10px;
	font-size: var(--font-subtitle1);
	background: url("../img/down.png") no-repeat right 10px top 21px;
	border: 1px solid var(--border-color);
	border-radius: 5px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	cursor: pointer;
	background-size: 12px;
}

.default-form .file-guide{ margin-top:8px; font-size:13px; color:#999; line-height:1.4; }

.default-form .submit-btn {
	display: block;
	margin: 55px auto 0;
	padding: 20px 50px;
	font-size: var(--font-title);
	font-weight: 600;
	text-align: center;
	color: var(--white-color);
	background: var(--primary-color);
	border-radius: 8px;
	transition: all .3s ease-in;
}
.default-form .submit-btn:hover {
	background: var(--black-color);
	border-radius: 8px;
}

.default-form .inquiry-agreement-con #privacy h3, .default-form .inquiry-agreement-con #privacy li { font-size:var(--font-footer); color:#686868; font-weight:300;}
/************************** 기본 폼 **************************/


@media all and (max-width:1501px){
	#about .top .img-wrap {height: 600px;}
}

@media all and (max-width:1281px){
	.sub-txt, #about .top img, .top .sub-cate, #about .identity .contents .img-list {margin-bottom: 40px;}
	.sub .sec-in { padding: 0 0 110px; }
	.sub .top .sec-in {	padding: 100px 0 75px; }

	#about .sec-1 .con1 > div+div { margin-left: 85px; }
	#about .sec-1 .con1 > div+div .head-title { margin-bottom:1.2em; padding-top:0;  }
	#about .sec-1 .con1 > div+div .body-contents p { margin-bottom:1.2em; }
	#about .sec-1 .con2 .bg { top: 32%; font-size: 300px; }
	#about .sec-1 .con2 > div+div { padding: 90px 0 150px 0;}
	#about .sec-2 .con1 { gap: 17px; margin-top: 35px; }
	#about .sec-2 .con1 > div > .txt { position: absolute; top:30px; left:30px; }

	#about_history .sec-1 .history-list  { margin-left: 80px; }

}

@media all and (max-width:1025px){
	.sub-top .sec-in {padding: 110px 0 60px;}
	.sub .top .sec-in {	padding: 70px 0 0;	}

	#privacy .sec-in { padding-top:0; }

	.sub-txt, #about .top img, .top .sub-cate, #about .identity .contents .img-list {margin-bottom: 30px;}
	.sub .sec-in { padding: 50px 0 90px; }

	#about.sub .sec-1 .sec-in {	padding: 50px 0 15px; }

	#about .sec-1 .con1 .img-wrap { height: 400px; }
	#about .sec-1 .con1 > div+div { margin-left: 50px; }
	#about .sec-2 .sec-in { flex-direction: column; }
	#about .sec-2 .sec-in > div, #about .sec-2 .sec-in > div+div { width: 100%; }
	#about .sec-2 .sec-in .con1 ul li span { min-width: 100px; }
	#about .sec-2 .con1 > div { width: calc( (100% - 40px) / 2 ) }
	#about .sec-2 .con1 > div > .txt { top: 20px; left: 20px; }

	#about .sec-3 .sec-in, #about .sec-4 .sec-in { padding: 90px 0 90px; }
	#about .sec-3 .service-wrap { gap:80px; margin-top: 35px; }
	#about .sec-3 .service-box{ gap:30px; }
	#about .sec-3 .service-box > div { width: 100%; }
	#about .sec-3 .service-box, #about .sec-3 .service-box.reverse { flex-direction: column; }
	#about .sec-3 .txt-box p { margin-bottom:10px; padding-bottom: 10px; }
	#about .sec-4 .strength-list { gap: 20px; }
	#about .sec-4 .btn-wrap a {  width: 200px;  height: 50px;}

	#about_history .sec-1 .history-list  { margin-left: 50px; }

	#product .product-list li{ width:calc((100% - 40px) / 2); }
	#product .product-detail-top{gap:40px;}
	#product .order-box{margin-top:70px;}

	#page_location .sec-1 .contents,
	#insu_consult .sec-1 .contents{ padding-top: 0; padding-left: 30px; }
	#page_location .sec-1 .contents ul,
	#insu_consult .sec-1 .contents ul{ flex-direction: column; }
	#page_location .sec-1 .contents ul li,
	#insu_consult .sec-1 .contents ul li{ margin-right: initial; width: 100%; padding: 25px 16px 25px 0; }
	#page_location .sec-1 .contents ul li:not(:last-child),
	#insu_consult .sec-1 .contents ul li:not(:last-child){ border-bottom: 1px solid #ddd; }
	#page_location .sec-1 .contents ul li span,
	#insu_consult .sec-1 .contents ul li span{ padding-bottom: 0; }

	#page_location .sec-1 .con1 > div { padding-top:inherit; }
	#page_location .sec-1 .con1 .map { padding-top:50px; }


	.default-form .inquiry-agreement-con { height:150px;  }
}

@media all and (max-width:768px){
	.sub-top {margin-top:80px;}
	.sub .sec-in { padding: 50px 0 90px; }

	#about .sec-1 .con1 { flex-direction: column; }
	#about .sec-1 .con1 > div:first-child {  }
	#about .sec-1 .con1 > div+div { margin-left: inherit; margin-top: 50px; }
	#about .sec-1 .body-contents p br { display: contents; }

	#about .sec-1 .con1 .img-wrap { height: 350px; }
	#about .sec-1 .con2 .bg { top: 25%; font-size: 200px; }
	#about .sec-1 .con2 > div+div { padding: 20px 0 130px 0;}

	#about .sec-3 .contents ul li:first-child { margin-top:20px;}
	#about .sec-4 .strength-list { flex-direction: column; gap: 20px; }
	#about .sec-4 .strength-box img { height: 250px }
	#about .sec-4 .strength-box .txt h3 { margin-bottom: 20px; }

	#about_history .sec-1 .con1 { flex-direction: column }
	#about_history .sec-1 .img-box { position:relative; top:0; width: 100%; }
	#about_history .sec-1 .history-list  { margin-top: 50px; margin-left: 0;}
	#about_history .sec-1 .history-list li { margin: 0 0 24px; padding: 12px 0 0 50px; }
	#about_history .sec-1 .history-list p:not(.year) span { min-width: 50px; }
	#about_history .sec-1 .history-list .year:before { top:22%; }


	#product .product-list{ gap:30px 20px; }
	#product .product-list li{ width:100%; }
	#product .product-detail-top{flex-direction:column;gap:50px;}
	#product .product-img{width:100%;max-width:none;}
	#product .product-info h3{font-size:22px;}
	#product .order-box{margin-top:40px;padding:0;}
	#product .qty-row{gap:20px;}
	#product .order-btn{width:100%;}
	#product .product-detail-content{padding:80px 20px;}
	#product .product-detail-bottom{padding:40px 20px;}
	#product .list-btn{ width: 130px; line-height: 46px; height: 46px; font-size: 16px;}

	.default-form .form > li { flex-direction: column; align-items: normal; padding: 25px 0; }
	.default-form .form > li > span { margin-bottom: 10px; }
	.default-form .radio-wrap { flex-direction: column; }
	.default-form .form > li input[type="file"]::file-selector-button { width: 100px; font-size: var(--font-small); }
	.default-form .submit-btn { padding: 15px 40px; }
	.default-form .form > li.jumin .jumin_wrap{ gap:10px; }
	.default-form .form > li.jumin .jumin_wrap input[type='text'],
	.default-form .form > li.jumin .jumin_wrap input[type='password']{ width:calc(50% - 20px); min-width:0; }

	#insu_consult .sec-1 .contents ul li span { min-width: 80px;}




	.mypage-wrap {
		display: block;
		padding: 0;
		margin-top: 90px;
	}

	.mypage-wrap .mypage-side {
		display: flex;
		gap: 20px;
		flex-wrap: wrap;
		padding: 0;
		margin-bottom: 25px;
		border-right: 0;
	}

	.mypage-wrap .mypage-side strong { width: 100%; }

	.mypage-wrap .mypage-side strong,
	.mypage-wrap .mypage-side a {
		margin-bottom: 0;
	}

	.mypage-wrap .mypage-content h2 {
		font-size: 28px;
		margin-bottom: 16px;
	}

	.mypage-wrap .search-row {
		flex-direction: column;
	}

	.mypage-wrap .date-range {
		width: 100%;
	}

	.mypage-wrap .date-range input {
		width: calc(50% - 12px);
	}

	.mypage-wrap .search-row select,
	.mypage-wrap .search-row input[type="text"],
	.mypage-wrap .search-row button {
		width: 100%;
		flex: auto;
	}

	.mypage-wrap .as-card,
	.mypage-wrap .order-card {
		padding: 18px;
	}

	.mypage-wrap .card-head {
		align-items: flex-start;
		gap: 8px;
		margin-bottom: 14px;
	}

	.mypage-wrap .as-body {
		display: block;
		margin-bottom: 14px;
	}

	.mypage-wrap .as-body .info strong,
	.mypage-wrap .order-title {
		font-size: 16px;
	}

	.mypage-wrap .as-body .meta {
		margin-top: 12px;
		text-align: left;
		font-size: 13px;
		gap: 4px;
	}

	.mypage-wrap .order-card {
		gap: 14px;
	}

	.mypage-wrap .order-thumb {
		flex: 0 0 82px;
		width: 82px;
		height: 82px;
	}

	.mypage-wrap .desc {
		font-size: 13px;
		line-height: 1.6;
	}

	.mypage-wrap .view-head {
		margin-bottom: 18px;
		padding-bottom: 16px;
		border-bottom: 1px solid #ddd;
	}

	.mypage-wrap .view-table {
		border-top: 1px solid #ddd;
	}

	.mypage-wrap .view-row {
		display: flex;
		flex-wrap: wrap;
		border-bottom: 0;
	}

	.mypage-wrap .view-th,
	.mypage-wrap .view-td {
		min-height: auto;
		padding: 14px;
		font-size: 13px;
		line-height: 1.5;
		border-bottom: 1px solid #ddd;
		box-sizing: border-box;
	}

	.mypage-wrap .view-th {
		width: 100px;
		flex: 0 0 100px;
		background: #f8f8f8;
		font-weight: 700;
		color: #111;
	}

	.mypage-wrap .view-td {
		width: calc(100% - 100px);
		flex: 0 0 calc(100% - 100px);
		background: #fff;
		color: #333;
	}

	.mypage-wrap .view-td.full {
		grid-column: auto;
		width: calc(100% - 100px);
		flex: 0 0 calc(100% - 100px);
	}

	.mypage-wrap .view-subject {
		margin: 34px 0 12px;
		font-size: 17px;
	}


	/* 주문내역 뷰 모바일 */
	.mypage-wrap .order-view-head {
		align-items: flex-start;
		gap: 14px;
		padding: 18px;
	}

	.mypage-wrap .order-view-thumb {
		flex: 0 0 82px;
		width: 82px;
		height: 82px;
	}

	.mypage-wrap .order-view-info strong {
		font-size: 16px;
	}

	.mypage-wrap .order-view-head .date {
		display: none;
	}


}

@media all and (max-width:641px){
	.sub-top {margin-top:60px;}

	.sub .sec-in { padding: 50px 0 80px; }
	.sub-title {line-height: 1.2;}
	.sub-top .sec-in {padding: 80px 0 40px;}
	.paragraph span, .sub-txt span {display: inline;}
	.sub-txt {line-height: 1.4;}
	.sub-txt, #about .top img, .top .sub-cate, #about .identity .contents .img-list {margin-bottom: 25px;}

	#about .sec-1 .con2 > div+div { padding: 10px 0 80px 0;}
	#about .sec-2 .sec-in .con1 ul li {padding: 20px 0 20px 5px;}
	#about .sec-2 .con1 > div { width: 100%; height: 150px; }
	#about .sec-2 .con1 > div > .txt { position: absolute; top:25px; left:25px; }
	#about .sec-3 .sec-in, #about .sec-4 .sec-in { padding: 70px 0 80px; }
	#about .sec-4 .top-area { margin-bottom: 50px;}
	#about .sec-4 .txt-box p {margin-bottom: 30px; }


	#history .sec-1 .con1 > div > ul > li > span { min-width: 120px; }
	#history .sec-3 .con1 ul { flex-wrap: wrap; gap: 25px; justify-content: center; padding-top: 5px; }
	#history .sec-3 .con1 ul li { width:calc( 50% - 50px / 2 );  }
	#history .sec-3 .con1 ul li > div { margin-top: 17px; }

	#insu_consult .con2 { padding: 30px 20px; }
	#insu_consult .con2 .tlt { margin-bottom: 20px; }
	#insu_consult .con2 ul { flex-direction: column; align-items: center; gap: 20px; }

	#page_location .sec-1 .contents ul li { flex-direction: column; padding: 30px 16px 25px 0; }
	#page_location .sec-1 .contents ul li span { padding-bottom: 10px; }

}

@media all and (max-width:481px){
	.sub-title-content { word-break: break-all; }
	.sub-title-content br { display: none; }
	#about .sec-3 .contents { margin-bottom:35px; }
	#about .sec-3 .contents ul { margin-bottom: 20px; }
	#about .sec-3 .txt-box p { word-break: break-all; }
	#about .sec-3 .txt-box p br { display: none; }
	#about .sec-4 .strength-box .txt { left: 40px; }

	#about .sec-4 .txt-box p { word-break: break-all; }
	#about .sec-4 .txt-box p br { display: none; }
}