/*---common css---*/

:root {
	/*color*/
	--color-base: #000;
	--color-kakao: #ffc401;
	--color-kakao-text: #442f01;
	--color-naver: #00c13a;

	/*font-size*/
	--font-size-14: 0.875rem;
	--font-size-16: 1rem; 
	--font-size-17: 1.0625rem; 
	--font-size-18: 1.125rem;
	--font-size-20: 1.25rem; 
	--font-size-26: 1.625rem;
	--font-size-27: 1.688rem; 
	--font-size-31: 1.938rem; 
	--font-size-31: 1.938rem; 
	--font-size-40: 2.5rem; 	
	--font-size-80: 5rem;

	/*font-weight*/
	--font-r: 400;
	--font-m: 500;
	--font-sb: 600;
	--font-b: bold;
	--font-bl: 900;
}

/*font size*/
.fs_14{font-size: var(--font-size-14);}
.fs_16{font-size: var(--font-size-16);} 
.fs_17{font-size: var(--font-size-17);} 
.fs_18{font-size: var(--font-size-18);}
.fs_20{font-size: var(--font-size-20);} 
.fs_26{font-size: var(--font-size-26);}
.fs_27{font-size: var(--font-size-27);} 
.fs_31{font-size: var(--font-size-31);}
.fs_40{font-size: var(--font-size-40);}
.fs_80{font-size: var(--font-size-80);}

@media screen and (max-width:1480px){

}

/*font weight*/
.font_r{font-weight: var(--font-r);}
.font_m{font-weight: var(--font-m);}
.font_sb{font-weight: var(--font-sb);}
.font_b{font-weight: var(--font-b);}
.font_bl{font-weight: var(--font-bl);}


/*text-motion*/
.j_motion.common_motion{transform: translateY(25px);opacity: 0;transition: transform .8s ease, opacity .4s;}
.j_motion.common_motion.on {transform: translateY(0);opacity: 1;}

.j_delay_01{transition-delay: .2s !important;}
.j_delay_02{transition-delay: .4s !important;}
.j_delay_03{transition-delay: .6s !important;}
.j_delay_04{transition-delay: .8s !important;}
.j_delay_05{transition-delay: 1s !important;}
.j_delay_06{transition-delay: 1.2s !important;}
.j_delay_07{transition-delay: 1.4s !important;}
.j_delay_08{transition-delay: 1.6s !important;}
.j_delay_09{transition-delay: 1.8s !important;}
.j_delay_10{transition-delay: 2s !important;}
.j_delay_11{transition-delay: 2.2s !important;}


/*---header---*/

#j_header {background:#000; width:100%; padding: 20px 0 65px 0; }
.j_hd_con {max-width:1280px; margin:0 auto; position:relative; display:flex; align-items: self-end; justify-content:space-between;}
.hd_logo {margin-top:20px;}
.tnd {color:#fff; position:absolute; right:0; top:0; display:flex; gap:15px; }
#j_header .j_gnb{color:#fff;}
#j_header .j_gnb {display:flex;}
#j_header .j_gnb > li {margin:0 15px; font-size:18px; font-weight:500;}



/*common*/

.mt_2 {margin-top:2px;}
.mt_4 {margin-top:4px;}
.mt_15 {margin-top:15px;}
.pl-5 {padding:0 0 0 5px !important;}
.pd_5 {padding:0 5px !important;}
.mt_27 {margin-top:27px;}
.mb_40 {margin-bottom:40px;}
.mt_40 {margin-top:40px;}
.mt_47 {margin-top:47px;}
.texc {text-align:center;}

/*width*/

.wr34 {width:34px;}
.wr50 {width:50px;}
.wr49 {width:49px;}
.wr68 {width:68px;}
.wr74 {width:74px;}
.wr89 {width:89px;}
.wr116 {width:116px;}
.wr135 {width:135px;}
.wr202 {width:202px;}
.wr300 {width:300px;}
.wr345 {width:345px;}
.wr430 {width:430px;}
.wr502 {width:502px;}
.wr700 {width:700px;}
/*----------------*/


/*height*/
.wh20 {height:20px; line-height:20px;}
.wh_29 {height:29.7px; line-height:29.7px;}
.wh_31_3 {height:31.3px; line-height:31.3px;}
.wh_30 {height:30px; line-height:30px;}

.wh_62_5 {height:62.5px; line-height:62.5px;}

.w100 {width:100%;}
.h100 {height:100%;}
/*----------------*/

.wrInput {display:block; background:#ddeef9; border:1px solid #ddeef9; padding:0 20px; font-weight:900; outline:none;}
.wrInput02 {border-bottom:4px solid #55a9df; border-top:0; border-left:0; border-right:0; background:none;}
.wrInput::placeholder {}
.wrInput:focus {border:none;}



/*--order_top--*/

.sub_section {padding:150px 0;}
.o_filed {position:relative; width:100%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); padding:20px; box-sizing:border-box; z-index:9;}
.o_filed img {max-width:100%; }
.step_tit {position: relative; font-weight: bold; opacity:0.3}
.step_tit.on {opacity:1;}
.step_tit.on i { position:relative;}
.step_tit.on i:after {content:''; position:absolute; bottom:-5px; left:0; width:100%; background:#e60610; height:3px;}

.tab_box {margin-bottom:50px; display:flex; justify-content:center;}
.tab_box a {display:block;}
.tab_box a + a {margin-left:20px;}


.view_box {display: flex; justify-content: right;    position: sticky; z-index: 99; top: 0;right: 0;}
.view_box a{display:block; width: 180px; background: #000; color: #fff;height: 60px; line-height: 60px; text-align: center; border-radius: 10px;}

.pop_img {display: none; position: fixed;  z-index: 99; width: 100%; height: 100%;  overflow: auto; cursor: pointer; background-color: rgba(0, 0, 0, 0.8);left: 0; top: 0;}

.pop_img img {    position: absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);}


.close_box {  position: absolute; width: 50px; height: 50px;  top: 5%; right: 5%; z-index: 99;}
.close_box span { display: block;  width: 20px; height: 2px; background: #fff; position: absolute;  left: 50%; top: 50%;  transform: translate(-50%, -50%);}
.close_box span:nth-of-type(1) {transform: rotate(45deg);}
.close_box span:nth-of-type(2) {transform: rotate(-45deg);}
/*----------------*/


/*필드 absolute */

.nation_f {position:absolute; top:1.2%; left:58%; z-index:10;}
.date_f {position:absolute; top:5.7%; left:62%; z-index:10;}
.no_f {position:absolute; top:8.1%; left:62%; z-index:10;}

.choose_b {height: 69px;width: 73px; position: absolute; top: 24.2%; left: 36.4%;z-index: 10;} 

.choose_b02 {height: 133px;width: 89px; position: absolute; top: 18.1%; right:2.5%; z-index: 10;}

.wr_57 {position:absolute; top:43.5%; left:3%; z-index:10; font-size:20px;}
.wr_57 input::placeholder {font-size:20px; font-weight:700;}



.choose_cfront {position:absolute; width:523px; height:430px; left:39.3%; top:13.1%;}
.wr_9 {position:absolute; left:10.5%; top:12.2%; font-size:20px; box-sizing:border-box;}
.wr_10 {position:absolute;right: 11%; top: 4.52%; font-size:20px; box-sizing:border-box;}
.wr_11 {position:absolute; left: 3.2%; top: 27.5%; font-size:20px; box-sizing:border-box;}
.wr_12 {position:absolute; right: 0.7%; top: 12.6%; font-size:20px; box-sizing:border-box;}
.wr_13 {position:absolute; left: 10.3%; top: 52.5%; font-size:20px; box-sizing:border-box;}
.wr_14 {position:absolute; right: 1.1%; top: 40.6%; font-size:20px; box-sizing:border-box;}
.wr_15 {position:absolute; left: 18.1%; top: 63.9%; font-size:20px; box-sizing:border-box;}
.wr_16 {position:absolute; right: 14.9%; top: 53.5%; font-size:20px; box-sizing:border-box;}
.wr_17 {position:absolute; left: 18.2%; bottom: 14%; font-size:20px; box-sizing:border-box;}
.wr_18 {position:absolute; right: 14.2%; bottom: 20.3%; font-size:20px; box-sizing:border-box;}
.wr_19 {position:absolute; right: 13%; bottom: 3.3%; font-size:20px; box-sizing:border-box;}


.wr_50 {position:absolute; left: -12.7%; top: -4.7%; font-size:20px; box-sizing:border-box; font-size:16px;}
.wr_50 input::placeholder {font-size:14px; font-weight:700;}
.wr_51 {position:absolute; left: 0.8%; top: 100.2%; font-size:20px; box-sizing:border-box; font-size:16px; display:flex; height:35px; width:204px;}
.wr_51 input::placeholder {font-size:14px; font-weight:700;}


.wr_51 input[type="checkbox"] {display: none; position: absolute; top: 0; left: 0; width: 0;height: 0; opacity: 0;  outline: 0; z-index: -1; overflow: hidden;}
.wr_51  input[type="checkbox"]:checked + label span { background: url('/img/icon/chk_b.png') no-repeat 50% 50%;}
.wr_51 label {display:flex; align-items:center; border:3px solid #000;}
.wr_51 label span {width:35px; height:102%; border-left:3px solid #000; display:block; background:#ddeef9; cursor:pointer;}
.wr_51 label b {margin:0 5px;}
.wr_60_box {position:relative;}
.wr_60_box p {position:absolute; left:5px; top:50%; transform:translateY(-50%); font-size:18px; font-weight:900; color:#a8a8a8;}
#wr_60 { border: 3px solid #000; border-left: none; position:relative; height:100%; font-size:20px; border-bottom:4px solid #55a9df;}
#wr_60:after {width:100%; content:''; height:4px; background:#55a9df; bottom:-1px; left:0; position:absolute;}


.pl-20 {padding-left:20px;}


.choose_cback {position:absolute; width:423px; height:385px; left:47.6%; top:41.6%;}
.wr_20 {position:absolute; left: 4.2%; top: 9.9%; font-size:20px; box-sizing:border-box;}
.wr_21 {position:absolute; left: 42%; top: 28.1%; font-size:20px; box-sizing:border-box;}
.wr_22 {position:absolute; right: 1%; top: 33.5%; font-size:20px; box-sizing:border-box;}
.wr_23 {position:absolute; left: 43%; top: 55.1%; font-size:20px; box-sizing:border-box;}
.wr_24 {position:absolute; left: 4.2%; bottom: 23.9%; font-size:20px; box-sizing:border-box;}
.wr_25 {position:absolute; left: 43%; bottom: 11.1%; font-size:20px; box-sizing:border-box;}
.wr_26 {position:absolute; right: 8.2%; bottom: 23.9%; font-size:20px; box-sizing:border-box;}

.wr_52 {position:absolute; right: -27.5%; bottom: 3%; font-size:20px; box-sizing:border-box; font-size:16px;}
.wr_52 input::placeholder {font-size:14px; font-weight:700;}


.choose_opback {position:absolute; width: 46px;  height: 87.7px; right:5%; top:51.9%;}
.choose_opback input[type="checkbox"] {display:none; position:absolute; top:0; left:0; width:0; height:0; opacity:0; outline:0; z-index:-1; overflow:hidden;}
.choose_opback label span {display: block;  background: #ddeef9; font-weight: 700; width:97%; height:25.4px; cursor: pointer;}
.choose_opback input[type="checkbox"]:checked + label span {background:url('/img/icon/chk_b.png') no-repeat 50% 50%;}


.size_box {position:absolute; width:150px; height:692px; left:30.4%; bottom:14.5%; font-size:20px;}

.shoul {position:absolute; left:5%; top:1.4%;}
.shoul02 {position:absolute; right:5%; top:1.4%;}

.arm_length {position:absolute; left:5%; top:8.1%;}
.arm_length02 {position:absolute; right:5%; top:8.1%;}

.over_length {position:absolute; left:5%; top:14.9%;}
.over_length02 {position:absolute; right:5%; top:14.9%;}

.chest {position:absolute; left:5%; top:21.6%;}
.chest02 {position:absolute; right:5%; top:21.6%;}

.waist {position:absolute; left:5%; top:28.3%;}
.waist02 {position:absolute; right:5%; top:28.3%;}

.hip {position:absolute; left:5%; top:34.9%;}
.hip02 {position:absolute; right:5%; top:34.9%;}

.front_c {position:absolute; left:5%; top:41.6%;}
.front_c02 {position:absolute; right:5%; top:41.6%;}

.down_s {position:absolute; left:5%; top:48.3%;}
.down_s02 {position:absolute; right:5%; top:48.3%;}

.ah_arm {position:absolute; left:5%; top:55%;}
.ah_arm02 {position:absolute; right:5%; top:55%;}

.tk_arm {position:absolute; left:5%; top:61.8%;}
.tk_arm02 {position:absolute; right:5%; top:61.8%;}

.fc_cir {position:absolute; left:5%; top:68.4%;}
.fc_cir02 {position:absolute; right:5%; top:68.4%;}

.ste {position:absolute; left:5%; top:75.1%;}
.ste02 {position:absolute; right:5%; top:75.1%;}

.for_length {position:absolute; left:5%; top:81.9%;}
.for_length02 {position:absolute; right:5%; top:81.9%;}

.j_height {position:absolute; left:5%; top:88.4%;}
.j_height02 {position:absolute; right:5%; top:88.4%;}

.j_weight {position:absolute; left:5%; bottom:0.8%;}
.j_weight02 {position:absolute; right:5%; bottom:0.8%;}

.choose_stat {position: absolute; width: 77px;  height: 345px; right: 23.7%;bottom: 19.1%;  font-size: 20px;}
.choose_stat input[type="checkbox"] {display:none; position:absolute; top:0; left:0; width:0; height:0; opacity:0; outline:0; z-index:-1; overflow:hidden;}
.choose_stat label span {display: block;  background: #ddeef9; font-weight: 700; width:74px; height:19.2px; cursor: pointer;}
.choose_stat input[type="checkbox"]:checked + label span {background:url('/img/icon/chk_b.png') no-repeat 50% 50%;}

.wr_42 {position:absolute; left:0; top:0.3px;}


.line_color {position:absolute;  left: 58%;bottom: 16.8%;}
.spell_color {position:absolute;  left: 61%; bottom: 14.5%;}
.name_fu {position:absolute; bottom: 12.1%; left: 8.2%;}
.j_Address {position:absolute;left: 16.2%; bottom: 10.2%;}

.jp_ad {position:absolute;  left: 14.7%;bottom: 8.3%;}
.jp_mail {position:absolute;  right: 6.2%; bottom: 8.3%;}
.jp_tel {position:absolute; bottom: 6.4%; left: 14.7%;}
.jp_address {position:absolute;right: 6.2%; bottom: 6.4%;}




.order_btn {text-align:center;}
.order_btn span {display:block;width:260px; height:100px; border-radius:10px; line-height:100px; background:#000; color:#fff; font-size:30px; font-weight:400;}

.bottom_info {display: flex; align-items: center; justify-content: space-around; margin-top: 60px; background: #fff; padding:20px;  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);}
.bottom_info figure {    box-sizing: border-box; border: 1px solid #ededed;}





/*order_bottom*/ /*wr_58~ */


.b_nation_f {position:absolute; top:1.4%; left:58%; z-index:10;}
.b_date_f {position:absolute; top:5.3%; left:62%; z-index:10;}
.b_no_f {position:absolute; top:7.6%; left:62%; z-index:10;}


.choose_cbottom {position: absolute; width: 336px; height: 567px;left: 45.6%; top: 11.1%;}
.wr_61{position:absolute;  left: 5.9%; top: 13.4%; font-size:20px; box-sizing:border-box;}
.wr_62{position:absolute;  right: 1.9%; top: 1.7%; font-size:20px; box-sizing:border-box;}
.wr_63{position:absolute;  right: 1.9%; top: 15.3%; font-size:20px; box-sizing:border-box;}
.wr_64{position:absolute;  right: 1.9%; top: 27%; font-size:20px; box-sizing:border-box;}

.wr_65{position:absolute;  right: -69.1%; top: 21.7%; font-size:20px; box-sizing:border-box; font-size:16px;}
.wr_65 input::placeholder {font-size:14px; font-weight:700;}

.wr_66{position:absolute;left: 3.9%; top: 35.7%; font-size:20px; box-sizing:border-box;}
.wr_67{position:absolute;  right: 47.9%; bottom: 4.7%; font-size:20px; box-sizing:border-box;}

.wr_68{position:absolute;  right: 70.9%; bottom: 1.7%; font-size:20px; box-sizing:border-box; font-size:16px;}
.wr_68 input::placeholder {font-size:14px; font-weight:700;}


.choose_c_back_bottom {position: absolute;  width: 380px; height: 567px;right: 1.6%; top: 22.1%;}
.wr_69{position:absolute; left: 10.5%; top: 20.4%; font-size:20px; box-sizing:border-box;}
.wr_70{position:absolute; right: 9.6%;top: 20.1%; font-size:20px; box-sizing:border-box;}
.wr_71{position:absolute; left: 5.5%; top: 34.9%; font-size:20px; box-sizing:border-box;}
.wr_72{position:absolute; right: 5.6%; top: 35.1%; font-size:20px; box-sizing:border-box;}
.wr_73{position:absolute; left: 10.5%; top: 48.8%; font-size:20px; box-sizing:border-box;}
.wr_74{position:absolute; right: 9.6%;top: 48.6%; font-size:20px; box-sizing:border-box;}
.wr_75{position:absolute; left: 4.5%; bottom: 24.2%; font-size:20px; box-sizing:border-box;}
.wr_76{position:absolute; right: 1%; bottom: 21.9%; font-size:20px; box-sizing:border-box;}
.wr_77{position:absolute; left: 32%; bottom: 4.4%; font-size:20px; box-sizing:border-box;}
.wr_78{position:absolute; right: 31%; bottom: 4.2%; font-size:20px; box-sizing:border-box;}

.wr_79{position:absolute; left: -40%;bottom: 3%; font-size:20px; box-sizing:border-box; font-size:16px;}
.wr_79 input::placeholder {font-size:14px; font-weight:700;}



.b_size_box {position: absolute; width: 154px; height: 373.7px; left: 33.4%; bottom: 34.6%; font-size: 20px;}

.b_waist {position:absolute; left:5%; top:1.4%;}
.b_waist02 {position:absolute; right:5%; top:1.4%;}

.b_hip {position:absolute; left:5%; top:14.4%;}
.b_hip02 {position:absolute; right:5%; top:14.4%;}

.b_over {position:absolute; left:5%; top:27.4%;}
.b_over02 {position:absolute; right:5%; top:27.4%;}

.b_leg {position:absolute; left:5%; top:40.4%;}
.b_leg02 {position:absolute; right:5%; top:40.4%;}

.b_girth {position:absolute; left:5%; top:53.4%;}
.b_girth02 {position:absolute; right:5%; top:53.4%;}

.b_back {position:absolute; left:5%; top:64.8%;}
.b_back02 {position:absolute; right:5%; top:64.8%;}

.b_height {position:absolute; left:5%; top:76.9%;}
.b_height02 {position:absolute; right:5%; top:76.9%;}

.b_weight {position:absolute; left:5%; top:89.4%;}
.b_weight02 {position:absolute; right:5%; top:89.4%;}


.b_choose_stat {position: absolute; width: 79px; height: 209px; right: 34.7%; bottom: 39.2%;font-size: 20px;}
.b_choose_stat input[type="checkbox"] {display:none; position:absolute; top:0; left:0; width:0; height:0; opacity:0; outline:0; z-index:-1; overflow:hidden;}
.b_choose_stat label span {display: block;  background: #ddeef9; font-weight: 700; width:77px; height:20px; cursor: pointer;}
.b_choose_stat input[type="checkbox"]:checked + label span {background:url('/img/icon/chk_b.png') no-repeat 50% 50%;}

.b_choose_stat02 {position: absolute; width: 79px; height: 209px; right: 16.4%; bottom: 39.2%;font-size: 20px;}
.b_choose_stat02 input[type="checkbox"] {display:none; position:absolute; top:0; left:0; width:0; height:0; opacity:0; outline:0; z-index:-1; overflow:hidden;}
.b_choose_stat02 label span {display: block;  background: #ddeef9; font-weight: 700; width:74px; height:20px; cursor: pointer;}
.b_choose_stat02 input[type="checkbox"]:checked + label span {background:url('/img/icon/chk_b.png') no-repeat 50% 50%;}


.b_line_color {position:absolute; bottom:37%; right:10%; z-index:10;}
.b_spell_color {position:absolute; bottom:34.7%; right:10%; z-index:10;}



.b_name_fu {position:absolute; bottom: 29.9%; left: 10%;}
.b_j_Address {position:absolute;left: 18.2%; bottom: 28.1%;}

.b_jp_ad {position:absolute;  left: 16%;bottom: 26.3%;}
.b_jp_mail {position:absolute;  right: 4.6%; bottom: 26.3%;}
.b_jp_tel {position:absolute; bottom: 24.5%; left: 16%;}
.b_jp_address {position:absolute;right: 4.6%; bottom: 24.5%;}


/*footer*/

.j_ft_con {max-width:1280px; margin:0 auto; position:relative; display:flex; align-items:center; justify-content:space-between; padding:40px 0;}

.o_x_filed {position: absolute; top: 10.6%; right: 21.8%; box-sizing:border-box; border:1px solid #a3a3a3; padding: 5px;font-size: 21px; font-weight: 500;}
.ox_box {display:flex; width:90px; justify-content: space-around;}
.ox_box input[type="radio"] + label {display:flex; align-items:center; cursor:pointer;}
.ox_box input[type="radio"] + label span {display: block; width: 15px; height: 15px; border-radius: 50%;background: #fff; border: 1px solid #55a9df; cursor: pointer;}
.ox_box input[type="radio"]:checked + label span {background-color:#55a9df;}
.ox_box input[type="radio"] + label b {margin-left:5px;}
.ox_box input[type="radio"] {display: none;position: absolute; top: 0; left: 0; width: 0;height: 0;opacity: 0; outline: 0; z-index: -1; overflow: hidden;}

