/* =========================================================
   PAGE
========================================================= */

.doublewin { position: relative; }
.doublewin .doublewin_sec_wrap { display: flex; }
.doublewin .doublewin_con_wrap { width: 50%; min-height: 100vh; }
.doublewin .doublewin_con_in { width: 100%; padding: 0 5%; }

.doublewin .doublewin_con_left_wrap { position: sticky; top: 0; height: 100vh; padding: 8% 0; background: #ededed; }
.doublewin .doublewin_con_right_wrap { padding: 8% 0 3%; }
.doublewin .doublewin_con_right_wrap .doublewin_con_in { border-bottom: 10px solid #ededed; }
.doublewin .doublewin_con_right_wrap .doublewin_con_in:last-child { border-bottom: none; }
.doublewin .option_group { padding: 8% 0; }
.doublewin .option_m_title { padding-bottom: 20px; border-bottom: 1px solid #ddd; }
.doublewin .option_required::before { content: "*"; color: #e84131; display: inline-block; transform: translateY(3px); }
.doublewin .option_s_title { padding: 40px 0 10px; }
.doublewin .option_list_wrap { padding-bottom: 80px; }
.option_list_wrap .sec_txt2 {line-height: 1.5;}
.doublewin .option_img { height: 300px; background: #ededed; border-radius: 16px; overflow: hidden; display: flex; justify-content: center; align-items: center; }
.doublewin .option_list_btn_wrap { display: flex; gap: 20px; flex-wrap: wrap; }
.doublewin .option_list_btn a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; border: 1px solid #ddd; border-radius: 50px; color: #000; }
.doublewin .option_list_btn a.active { background: #000; border-color: #000; color: #fff; }
/* =========================================================
   IMAGE OPTION
========================================================= */

.img_option_list_btn_wrap { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px 10px; }
.img_option_list_btn_wrap .img_option_list_btn_img { aspect-ratio: 4/3; background: #eee; border-radius: 16px; overflow: hidden; margin-bottom: 20px; }
.img_option_list_btn_img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.img_option_list_btn a { display: flex; flex-direction: column; gap: 8px; color: #000; }
.img_option_list_btn a.active { font-weight: 700; }
/* =========================================================
   POPUP
========================================================= */

.pop_btn { position: fixed; left: 2.5%; bottom: 5%; z-index: 9999999; padding: 20px; border-radius: 20px; cursor: pointer; background: linear-gradient(90deg,#E53935 0%,#FF6A00 100%); }
.pop_btn i { font-size: 24px; color: #fff; transition: transform .25s ease; }
.pop_btn i.xi-close { transform: rotate(90deg); }
.dim { position: fixed; inset: 0; z-index: 9999998; background: rgba(0,0,0,.45); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.dim.is-open { opacity: 1; pointer-events: auto; }
.pop_con { position: fixed; left: 2.5%; bottom: calc(7% + 64px); z-index: 9999999; display: none; width: 700px; padding: 40px; border-radius: 24px; background: #fff; border: 1px solid #eee; overflow: hidden; }
.pop_con .estimate_con_wrap { position: relative; }
.pop_con .owl-stage-outer { overflow: hidden; }
.pop_con .owl-dots, .pop_con .owl-nav { display: none!important; }
/* =========================================================
   ESTIMATE
========================================================= */

.estimate_tit { display: flex; justify-content: space-between; align-items: center; }
.estimate_down a { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; border-radius: 50px; font-size: 20px; color: #fff; background: linear-gradient(90deg,#E53935 0%,#FF6A00 100%); }
.estimate_table { margin-top: 12px; }
.estimate_table .tr { display: grid; grid-template-columns: 1.2fr 1.2fr 1fr; gap: 10px; align-items: center; padding: 8px 10px; }
.estimate_table .tr.th { font-weight: 600; padding: 10px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.estimate_table .td { font-size: 17px; }
.estimate_table .td.item { padding-left: 6px; }
.estimate_table .td.price { text-align: right; padding-right: 6px; }
.estimate_table b { font-weight: 600; }
.pop_con .estimate_table .item, .pop_con .estimate_table .opt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3; }
.unit { margin-left: 8px; font-weight: 600; }
.estimate_total { padding: 16px; background: #f2f2f2; display: flex; justify-content: space-between; align-items: center; color: #000; }
.estimate_total .t_left { font-size: 18px; font-weight: 600; }
.estimate_total .t_right { font-size: 20px; font-weight: 600; }
/* =========================================================
   HEADER / NAV
========================================================= */

.header_mid { display: flex; align-items: center; }
.doublewin_nav { display: flex; gap: 40px; padding: 40px 0 40px 150px; }
.doublewin_nav a { font-size: 18px; font-weight: 500; }


/* =========================================================
   MOBILE MENU
========================================================= */

body.mm_on { overflow: hidden; }
body.mm_on .m_menu_wrap { transform: translateX(0); }

.m_menu_wrap {display: none; position: fixed; top: 0; right: 0; width: 50%; height: 100vh; background: #fff; z-index: 9999; transform: translateX(100%); transition: transform .3s ease; }
.m_menu { padding: 80px 20px 40px; }
.m_menu ul { margin: 0; padding: 0; list-style: none; }
.m_menu li { border-bottom: 1px solid #eee; }
.m_menu a { display: block; padding: 16px 0; font-size: 18px; font-weight: 500; color: #000; }
.m_all_bg { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); z-index: 9998; }
.m_menu_btn_wrap { display: none; }


/* =========================================================
   TOTAL COST
========================================================= */


.total_cost { width: 100%; color: #111; }
.total_cost_tit { font-size: 18px; font-weight: 700; padding-bottom: 14px; border-bottom: 1px solid #e5e5e5; }
.total_cost_row { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; border-bottom: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5; }
.total_cost_row .label { font-size: 22px; }
.total_cost_row .value { display: flex; align-items: baseline; gap: 12px; }
.total_cost_row .num { font-size: 30px; font-weight: 600; }
.total_cost_row .unit { font-size: 16px; }
/* =========================================================
   FOOTER
========================================================= */

.footer_wrap { width: 100%; padding: 5%; display: flex; justify-content: space-between; }
.footer_left { display: flex; gap: 60px; align-items: center; }
.footer_info { display: flex; gap: 20px; align-items: center; font-size: 16px; color: #555; }
.footer_info div { position: relative; }
.footer_info div::after { content: ''; position: absolute; width: 1px; height: 16px; background: #cdcdcd; display: inline-block; right: -10px; top: 5px; }
.footer_info div:last-child::after { display: none; }
.footer_doublewin_link a { padding: 16px 20px; display: inline-block; background: #000; color: #fff; border-radius: 50px; font-size: 18px; }
.footer_doublewin_link a:hover { background: linear-gradient(90deg,#E53935 0%,#FF6A00 100%); }
/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1800px) {
	.pop_con { transform: scale(.8); transform-origin: left bottom; }
}
@media(max-width:1200px) {

	.doublewin .doublewin_sec_wrap { flex-direction: column; }
	.doublewin .doublewin_con_wrap { width: 100%; min-height: auto; }
	.doublewin .doublewin_con_left_wrap { position: relative; height: auto; padding: 60px 0; }
	.doublewin .doublewin_con_right_wrap { padding: 60px 0; }
	.img_option_list_btn_wrap { grid-template-columns: repeat(3,1fr); gap: 30px 10px; }
	.pop_con { width: 90%; left: 5%; bottom: 120px; transform: none; }
	.doublewin_nav { gap: 20px; font-size: 16px; }
	.total_cost_row .label { font-size: 18px; }
	.total_cost_row .num { font-size: 24px; }
}
@media (max-width:1024px) {

    .doublewin_nav { display: none; }
    .m_menu_btn_wrap { display: block; }
    
	.m_menu_wrap { display: block; }
	.doublewin .doublewin_sec_wrap { flex-direction: column; }
	.doublewin .doublewin_con_wrap { width: 100%; }
}
@media(max-width:768px) {

	.doublewin .doublewin_con_in { padding: 40px 5%; }
	.option_img { height: 200px; }
	.option_list_btn_wrap { gap: 10px; }
	.option_list_btn a { padding: 10px 14px; font-size: 14px; }
    .img_option_list_btn * {font-size: 14px;}
	.img_option_list_btn_wrap { gap: 20px 8px; }
	.img_option_list_btn_img { margin-bottom: 0px; border-radius: 8px; }
    
	.pop_btn { left: 20px; bottom: 20px; padding: 14px; }
	.pop_btn i { font-size: 20px; }
	.pop_con { padding: 24px; bottom: 100px; }
	.estimate_table .td { font-size: 14px; }
	.estimate_down a { font-size: 16px; padding: 10px 16px; }
	.footer_wrap { flex-direction: column; gap: 20px; }
	.footer_left { flex-direction: column; gap: 20px; align-items: flex-start; }
	.footer_info { flex-wrap: wrap; gap: 10px; font-size: 14px; }
}
@media(max-width:480px) {

	.img_option_list_btn_wrap { grid-template-columns: 1fr; }
	.option_img { height: 180px; }
	.option_m_title { font-size: 18px; }
	.option_s_title { font-size: 16px; padding: 20px 0 10px; }
	.total_cost_row { flex-direction: column; align-items: flex-start; gap: 6px; }
	.total_cost_row .label { font-size: 16px; }
	.total_cost_row .num { font-size: 22px; }
	.pop_con { width: 94%; left: 3%; padding: 20px; }
	.estimate_total .t_left { font-size: 16px; }
	.estimate_total .t_right { font-size: 18px; }

    .doublewin_con_tit .sec_txt2 br{display: none; }
    .doublewin_con_tit .sec_txt2 { line-height: 1.5;}
}