@charset "utf-8";
/* ----------------------------------------------------
■ 공통 - style 
-----------------------------------------------------*/
:root {
	--hl-primary: #526daa;
}
/* background 
------------------------------------------------------- */
.bg_01 { background: #f1f3f6 !important; }
.bg_02 { background: #f8f8f8 !important; padding: 30px; }
.bg_03 { background: #e2e9ff !important;}
.bg_04 { background: #d5dcf5 !important;}
.bg_05 { background: #c7d1ef !important;}
.bg_06 { background: #a9b6db !important;}
.bg_07 { background: #e2e3e7 !important;}
.bg_08 { background: #fff; font-size: 2.50em; font-weight: 900; color: #8590b3;}
.bg_09 { background: #addbff !important; }
.bg_10 { background: #ffffff !important; }

/* margin 
------------------------------------------------------- */
.mt0     { margin-top: 0 !important; }
.mt10    { margin-top: 10px; }
.mt20    { margin-top: 20px; }
.mt30    { margin-top: 30px; }
.mt40    { margin-top: 40px; }
.mt50    { margin-top: 50px; }
.mb0     { margin-bottom: 0 !important; }
.mb10    { margin-bottom: 10px; }
.mb20    { margin-bottom: 20px; }
.mb30    { margin-bottom: 30px; }
.mb40    { margin-bottom: 40px; }
.mb50    { margin-bottom: 50px; }
.mb80    { margin-bottom: 80px; }
.ml10    { margin-left: 10px; }
.ml20    { margin-left: 20px; }
.ml30    { margin-left: 30px; }
.ml40    { margin-left: 40px; }
.ml50    { margin-left: 50px; }
.mr10    { margin-right: 10px; }
.mr20    { margin-right: 20px; }
.mr30    { margin-right: 30px; }
.mr40    { margin-right: 40px; }
.mr50    { margin-right: 50px; }

/* padding 
------------------------------------------------------- */
.pt0  { padding-top: 0; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }
.pb0  { padding-bottom: 0; }
.pb10 { padding-bottom: 10px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }
.pb100{ padding-bottom: 100px; }
.pl10 { padding-left: 10px; }
.pl20 { padding-left: 20px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }
.pl50 { padding-left: 50px; }
.pr10 { padding-right: 10px; }
.pr20 { padding-right: 20px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }
.pr50 { padding-right: 50px; }
.pd10 { padding: 10px; }
.pd20 { padding: 20px; }
.pd30 { padding: 30px; }

/* text-align 
------------------------------------------------------- */
.tal { text-align: left; } 
.tac { text-align: center; } 
.tar { text-align: right; } 

/* text-color 
------------------------------------------------------- */
.col_01 { color: var(--hl-primary) !important; }
.col_02 { color: #cc2220 !important; }
.col_03 { color: #ff2929 !important; }
.col_04 { color: #277aab !important; }
.col_05 { color: #007e8f !important; }
.col_06 { color: #3ce8ff !important; }
.col_07 { color: #009400 !important; }
.col_08 { color: #757575 !important; }

/* border 
------------------------------------------------------- */
.brT_no { border-top: 0 none !important; }
.brT_01 { border-top: 1px solid #888888; }
.brR_no { border-right: 0 none !important; }
.brR_01 { border-right: 1px solid #ccc !important; }
.brB_no { border-bottom: 0 none !important; }
.brB_01 { border-bottom: 1px solid #ccc; }
.brL_no { border-left: 0 none !important; }
.brL_01 { border-left: 1px solid #dddddd !important; }
.brL_03 { border-left: 3px solid #47a3da; }

/* width
------------------------------------------------------- */
.min_500 { min-width: 500px; }
.min_600 { min-width: 600px; }
.min_800 { min-width: 800px; }
.min_1000 { min-width: 1000px; }
.width_80 { width: 80%; margin: 0 auto; }
.width_100 { width: 100%; margin: 0 auto; }

@media all and (max-width:1024px){ 
	.width_80 { width: 100%; }
}


/* title-text 
------------------------------------------------------- */
.page_title_01 { position: relative; font-size: 3.5rem; line-height: 1.5; text-align: center; padding: 50px 0 70px 0; color: var(--hl-primary); word-break: keep-all; transition: all 0.5s; }
.page_title_01::after { position: absolute; content: ''; top: 110px; left: 50%; margin-left: -60px; width: 120px; height: 4px; background: #e6e6fa; z-index: -1; }
.title_01 { font-size: 2.0rem; line-height: 1.5; }
.title_02 { font-size: 1.8rem; color: #0051a4; line-height: 1.8; }
.title_03 { font-size: 2.0rem; padding: 10px 20px; border-left: 10px solid #0051a4; background: #f7f7f7; line-height: 1.8; margin-bottom: 30px; word-break: keep-all;}
.title_04 { font-size: 2.0rem; position: relative; margin: 0 0 10px 10px; }
.title_05 { font-size: 1.8rem; padding-left: 20px; margin-left: 20px; background: url('../img/icon_title_01.png') no-repeat left center; }
.title_06 { font-size: 2.5rem; text-align: center; margin-bottom: 30px;}

.font_01 { font-size: 1.8rem; line-height: 1.8; word-break: keep-all; }
.font_02 { font-size: 2.0rem; word-break: keep-all; }
.font_03 { font-size: 1.4rem; word-break: keep-all; }

@media screen and (max-width: 500px){
	.font_01 { font-size: 1.7rem; line-height: 1.5; }
	.page_title_01::after { top: 90px; }
	.page_title_01 { padding-bottom: 40px; }
	.page_title_01 { font-size: 2.5rem; }
}

/* button-style
------------------------------------------------------- */
.btn { padding: 10px 40px; text-align: center; font-size: 1.8rem; border-radius: 10px; word-break: keep-all; } 
.btn_blue01 { 
	border: none; background: var(--hl-primary); color: #fff !important; 
		-moz-box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			transition: all 0.3s;
}
.btn_blue01:hover { background: #344979; box-shadow: none;}

.btn_blue02 { 
	width: 148px; border: 1px solid #143556; background: #143556; color: #fff !important; 
		-moz-box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			transition: all 0.3s;
}
.btn_blue02:hover { border: 1px solid var(--hl-primary); background: var(--hl-primary); box-shadow: none; }

.blue_line { 
	border: 1px solid var(--hl-primary); color: var(--hl-primary) !important; 
		-moz-box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			transition: all 0.3s;
}
.blue_line:hover { background: var(--hl-primary); color: #fff !important; box-shadow: none; }

.btn_pink {
	border: none; background: #ff5c92; color: #fff !important;  
		-moz-box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			box-shadow: 0 3px 5px 0 rgba(27, 38, 78, 0.3); 
			transition: all 0.3s;
}
.btn_pink:hover {background: #be3663; box-shadow: none;}

.btn_list { color: #fff; font-size: 1.8rem; border-radius: 10px; background: #143556; transition: all 0.3s;}
.btn_list:hover { background: #47a3da; }
.btn_gray_01 span { display: inline-block; color: #fff; height: 45px; line-height: 45px; padding: 0 15px; background: #777; transition: all 0.3s; border-radius: 4px; }
.btn_gray_01:hover { background: #47a3da; }

.btn_pdf { position: relative; color: #fff !important; padding: 10px 40px 10px 20px; background: var(--hl-primary); box-shadow: 0 5px 8px rgba(82,109,170,0.4); transition: all 0.3s; }
.btn_pdf::after { position: absolute; content: ''; top: 0px; right: 10px; width: 22px; height: 22px; opacity: 0; background: url('../img/btn_download.png') no-repeat; transition: all 0.3s;}
.btn_pdf:hover { background: #344979; box-shadow: none;}
.btn_pdf:hover::after { opacity: 1; transform: translateY(14px); transition: all 0.3s;}

.btn_down { position: relative; color: #60679b !important; font-size: 1.6rem; padding: 5px 40px 5px 10px;  border-bottom: 2px solid #60679b; background: #f5f6ff; transition: all 0.3s; }
.btn_down::after { position: absolute; content: ''; top: -5px; right: 10px; width: 22px; height: 22px; opacity: 0; background: url('../img/btn_download.png') no-repeat; transition: all 0.3s;}
.btn_down:hover { color: #fff !important; background: #60679b; box-shadow: none;}
.btn_down:hover::after { opacity: 1; transform: translateY(13px); transition: all 0.3s;}

.btn_right01 { position: relative; color: #fff !important; font-size: 1.8rem; padding: 10px 20px; border-radius: 10px; background: var(--hl-primary); word-break: keep-all; transition: all 0.3s; }
.btn_right01::after { position: absolute; content: ''; top: 30%; right: 20px; width: 22px; height: 22px; opacity: 0; background: url('../img/btn_map_right.png') no-repeat; transition: all 0.3s;}
.btn_right01:hover { padding: 10px 50px 10px 20px; background: #34497a; }
.btn_right01:hover::after { opacity: 1; transform: translateX(10px); transition: all 0.3s;}

.btn_right02 { position: relative; color: #60679b !important; font-size: 1.6rem; padding: 5px 40px 5px 10px; border-bottom: 2px solid #60679b; background: #f5f6ff; transition: all 0.3s; }
.btn_right02::after { position: absolute; content: ''; top: 24%; right: 10px; width: 22px; height: 22px; opacity: 0; background: url('../img/btn_map_right.png') no-repeat; transition: all 0.3s;}
.btn_right02:hover { color: #fff !important; background: #60679b; box-shadow: none;}
.btn_right02:hover::after { opacity: 1; transform: translateX(10px); transition: all 0.3s;}

.btn_right03 { position: relative; color: #60679b !important; font-size: 1.4rem; padding: 5px 14px; background: #f5f6ff; transition: all 0.3s; }
.btn_right03::after { position: absolute; content: ''; top: 50%; right: 10px; width: 22px; height: 22px; opacity: 0; margin-top: -9px; background: url('../img/btn_map_right.png') no-repeat; transition: all 0.3s;}
.btn_right03:hover { padding-right: 30px; color: #fff !important; background: #60679b; box-shadow: none; }
.btn_right03:hover::after { opacity: 1; transform: translateX(10px); transition: all 0.3s;}

.btn_search { width: 45px; height: 45px; background: var(--hl-primary); border-radius: 4px; transition: all 0.3s; }
.btn_search img { padding: 12px; }
.btn_search:hover { background: #777; border-radius: 4px; }

.btn_s01 { color: #fff !important; padding: 10px; background: var(--hl-primary); border-radius: 5px; }
.btn_s01:hover { background: #344085; text-decoration: underline; }
.btn_s02 { color: #333333 !important; padding: 10px; background: #cccccc; border-radius: 5px; }
.btn_s03 { position: relative; color: #60679b; font-size: 1.4rem; padding: 5px 14px; border-radius: 6px; background: #f5f6ff; transition: all 0.3s; }
.btn_s03:hover { color: #fff; background: #60679b; }

@media screen and (max-width: 900px){
	.btn_down { margin-bottom: 10px; }
	.btn_right { margin-left: 0; word-break: break-all; }
}

@media screen and (max-width: 500px){
	.btn { padding: 10px 20px; }
	.blue02 { width: auto; }
}

/* input 
------------------------------------------------------- */
input[type="tel"],
input[type="text"],
input[type="email"],
input[type="password"] { border: 1px solid #ddd; padding: 5px 10px; height: 46px; border-radius: 4px; }

input[type="tel"]:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus { border: 1px solid #47a3da;  }

input[type='radio'] { display: none; }
input[type='radio'] + label span.radio_bg {display: inline-block; width: 20px; height: 20px; vertical-align: middle; border: 1px solid var(--hl-primary); border-radius: 10px; cursor: pointer; font-size: 0; margin: -2px 9px 0 4px; }
input[type='radio']:checked + label span.radio_bg {display: inline-block; background: var(--hl-primary) url('../img/icon_radio_checked.png') no-repeat center center;} 

input[type='checkbox'] { display: none; }
input[type='checkbox'] + label { color: #333; }
input[type='checkbox'] + label span.checkbox_01 { display: inline-block; width: 20px; height: 20px; vertical-align: middle; cursor: pointer; font-size: 0; margin: -2px 9px 0 4px; background: #fff; transition: all 0.3s;}
input[type='checkbox']:focus + label span.checkbox_01::before { outline: 2px solid blue; outline-offset: 3px;}
input[type='checkbox']:checked + label span.checkbox_01 { display: inline-block; background-color: #777777; background: #777777 url('../img/icon_checked.png') no-repeat center center; } 
input[type='checkbox']:checked:focus + label::before { outline: 2px dashed blue; outline-offset: 3px; }

/* select 
------------------------------------------------------- */
.select_01 { width: 20%; height: 45px; padding: 0 20px; background: #fff url('../img/sch_arr_icon.png') no-repeat right 20px center; appearance: none; border: 1px solid #e0e0e0; border-radius: 4px; }
.select_01:focus,
.select_01:focus-visible { outline: 1px solid #47a3da; border: 1px solid #47a3da;}


/* paging 
------------------------------------------------------- */
.paging { position: relative; margin: 30px 0; text-align: center; } 
.paging a { position: relative; display: inline-block; min-width: 30px; min-height: 30px; line-height: 30px; vertical-align: top; border: 1px solid #d5d5d5; } 
.paging a::after { content: ''; display: block; clear: both; } 
.paging a.first::after { width: 10px; height: 10px; margin: 10px; background: url('../img/first.png') 0 0 no-repeat; } 
.paging a.prev::after  { width: 10px; height: 10px; margin: 10px; background: url('../img/prev.png') 0 0 no-repeat; } 
.paging a.last::after  { width: 10px; height: 10px; margin: 10px; background: url('../img/last.png') 0 0 no-repeat; } 
.paging a.next::after  { width: 10px; height: 10px; margin: 10px; background: url('../img/next.png') 0 0 no-repeat; } 
.paging span a:hover { background: #eeeeee; color: #000; } 
.paging .selected { background: var(--hl-primary); border: 1px solid var(--hl-primary); color: #fff; }

/* bullet
------------------------------------------------------- */
.square01,
.square02,
.square03,
.square04,
.circle01 { position: relative; }
.square01::before { position: absolute; content: ''; display: block; width: 20px; height: 20px; background: #316d8a; margin: 5px 0 0 -30px; }
.square02::before { position: absolute; content: ''; display: block; width: 20px; height: 20px; background: #777777; margin: 5px 0 0 -30px; }
.square03::before { position: absolute; content: ''; display: block; width: 20px; height: 20px; background: #ff4060; margin: 5px 0 0 -30px; }
.square04::before { position: absolute; content: ''; display: block; top: 0; left: 0; width: 6px; height: 6px; background: var(--hl-primary); margin-top: 10px; }
.circle01::before { position: absolute; content: ''; display: block; top: 0; left: 0; width: 6px; height: 6px; background: var(--hl-primary); margin-top: 10px; border-radius: 3px;}


/* 기타
------------------------------------------------------- */
.word_keep { word-break: keep-all !important; }
.word_nor { word-break: normal !important; }
.blind { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } 
caption > div, 
legend, .hide { display: block; position: absolute; overflow: hidden; border: 0; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px); }
a.email { color:#455e99; vertical-align: baseline; }
a.email:hover, a.email:active { color: #203055; text-decoration: underline; }
.w80  { width: 80%; }
.w100 { width: 100%; }
.vat { vertical-align: top !important; }
.vam { vertical-align: middle; }
.img_center { margin: 0 auto; }
.inline { display: inline-block !important; }
.errmsg { width: 100%; text-align: center; color: #676767; font-size: 1.4rem; padding: 50px 10px; background: #f7f7f7;} 
.unvisual { display: none; } 
.clr { clear: both; }
.clr:after { display: block; content: ""; clear: both; }

/* ul / ol
------------------------------------------------------- */
.ol_list01 { margin-left: 20px; }
.ol_list01 > li { list-style: decimal; margin-bottom: 10px; word-break: keep-all; }

.ul_list01 { padding-left: 20px; padding-bottom: 20px; }
.ul_list01 > li { list-style-type:square; margin-bottom:10px; font-size: 1.8rem; word-break: keep-all; }

.ul_list02 { padding-left: 20px; padding-bottom: 20px;}
.ul_list02 > li { list-style-type: disc; margin-bottom:5px; font-size: 1.8rem; word-break: keep-all; } 

.ul_list03 > li { position: relative; padding-left: 15px; margin: 0 0 7px 5px;}
.ul_list03 > li::before { position: absolute; content: ''; display: block; top: 0; left: 0; width: 6px; height: 6px; background: var(--hl-primary); margin-top: 10px; border-radius: 3px;}

.ul_list04 > li { font-size: 1.6rem; background:url("../img/list_02.png") no-repeat  0 16px; padding: 6px 10px; width:100%; height:auto;}

@media screen and (max-width: 600px){
	.ol_list01 > li,
	.ul_list01 > li,
	.ul_list02 > li,
	.ul_list03 > li, 
	.ul_list04 > li { font-size: 1.6rem; }
}

/* box-style 
--------------------------------------------------------*/
.tBox_01 { position: relative; font-size: 2.0rem; line-height: 1.8; background: #f1f3f6; padding: 20px; margin-bottom: 20px; }
.tBox_01::after { position: absolute; content: ''; bottom: 15px; right: 10px; left: auto; width: 50%; top: 80%; max-width: 300px; background: #777; 
	-moz-box-shadow: 0 15px 10px #777; box-shadow: 0 15px 10px #777; 
	-webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;
}
.tBox_02 { position: relative; background: #f1f3f6; padding: 20px; margin-bottom: 20px; }
.tBox_02:before, 
.tBox_02:after { position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width:300px; background: #777; 
	-moz-box-shadow: 0 15px 10px #777; box-shadow: 0 15px 10px #777;
	-webkit-transform: rotate(-3deg);-moz-transform: rotate(-3deg);-o-transform: rotate(-3deg);-ms-transform: rotate(-3deg);transform: rotate(-3deg);
	z-index: -1;
}
.tBox_02:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto;}
.tBox_03 { border: 1px solid #e6e6e6; padding: 30px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }
.tBox_04 { border: 1px solid #ddd; padding: 20px; }
.tBox_05 { border-top: 1px solid #aaaaaa; padding: 20px; background: #eeeeee; }

@media screen and (max-width: 600px){
	.tBox_01 { font-size: 1.8rem; }
}

/* 로그인 팝업 */
.login_modal { 
	width:100%; height:100%; position:fixed; top:0; left:0; background:rgba(0,0,0,0.75); visibility:hidden; opacity:0; 
	-webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out; z-index: 110;
}
.login_modal.open { opacity:1; visibility:visible; }
.login_modal .modal { 
	position:relative; display:block; top:0; left:0; width:40%; margin:-100px 0 0 30%; background:#fff; opacity:0;
	-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;
}
.login_modal.open .modal { margin-top: 5%; opacity:1; }
.login_modal .modal .head { width: 100%; padding: 10px 20px; overflow: hidden; background:#f0f0f0; }
.login_modal .modal .btn_close { width: 26px; height: 30px; display: block; float: right; }
.login_modal .modal .btn_close::before, 
.login_modal .modal .btn_close::after { content:''; width: 26px; height: 2px; display: block; background: #333;}
.login_modal .modal .btn_close::before { margin-top: 15px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
.login_modal .modal .btn_close::after { margin-top: -2px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }

/* 팝업 내용 */
.login_form { padding: 20px; word-break: keep-all;}
.login_form h1 { font-size: 2.4rem; font-weight:600; text-align:center; }
.login_form > p { width: 70%; margin: 0 auto 20px auto; padding: 10px; background: #f0f0f0; }
.login_form > ul { 
	display: -webkit-box; display: -ms-flexbox; display: flex;
	-webkit-box-align: center; -ms-flex-align: center; align-items: center;
	-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px;}
.login_form > ul > li { width: 70%; }
.login_form > ul > li > input { width: 100%; height: 42px; }
.login_form > ul > li > input:focus { border: 1px solid #47a3da !important; }

@media all and (max-width:1280px){
	.login_modal .modal { width: 60%; margin-left: 20%;}
}
@media all and (max-width:900px){
	.login_modal .modal { width: 90%; margin-left: 5%; }
}
@media all and (max-width:500px){
	.login_form > p { width: 100%; }
	.login_form > ul > li { width: 100%; }
}

/* 관리자 팝업 - 26.04.29
------------------------------------------------------- */
.main_popup { position: fixed; max-width: 1000px; border-radius: 10px; z-index: 1000;
    box-shadow: 0 13px 27px -5px hsl(240deg 30% 28% / 25%), 0 8px 16px -8px hsl(0deg 0% 0% / 30%), 0 -6px 16px hsl(0deg 0% 0% / 3%);
    -webkit-box-shadow: 0 13px 27px -5px hsl(240deg 30% 28% / 25%), 0 8px 16px -8px hsl(0deg 0% 0% / 30%), 0 -6px 16px hsl(0deg 0% 0% / 3%);}
.main_popup .popup_top { padding: 16px; text-align: center; background: #fff; border-radius: 10px 10px 0 0; }
.main_popup .popup_top .pop_tit { font-size: 2.0rem; color: #fff83f; padding: 5px 10px; background: #170f44; margin-bottom: 14px; }
.main_popup .popup_top > a { transition: all 0.3s; width: 100%; }
.main_popup .popup_top > a:hover { background: #f0edff; }
.main_popup .popup_top ul { display: -webkit-box; display: -ms-flexbox; display: flex; }
.main_popup .popup_top img { object-fit: contain; }
.main_popup .popup_top .popT_01 { width: 350px; text-align: left; padding-left: 20px; }

.main_popup .popup_bottom { text-align: right; background: #e0e0e0; border-radius: 0 0 10px 10px; min-height: 50px; }
.main_popup .popup_bottom .pop_close { padding: 6px 20px; font-weight: bold; color: #333; background: none; border: none;}
.main_popup .popup_bottom .pop_close:hover { text-decoration: underline; }

/* 팝업 좌표값 설정 */
.main_popup.position_1 { top: 150px; left: 30px; }
.main_popup.position_2 { top: 150px; left: 130px; }
.main_popup.position_3 { top: 150px; left: 230px; }
.main_popup.position_4 { top: 150px; left: 330px; }
.main_popup.position_5 { top: 150px; left: 430px; }
@media all and (max-width:1024px){
	.main_popup.position_1 { top: 70px; left: 30px; }
	.main_popup.position_2 { top: 70px; left: 130px; }
	.main_popup.position_3 { top: 70px; left: 230px; }
	.main_popup.position_4 { top: 70px; left: 330px; }
	.main_popup.position_5 { top: 70px; left: 430px; }
}
@media all and (max-width:768px){
	.main_popup { margin: 0 20px; }
	.main_popup.position_1 { top: 70px; left: 0px; }
	.main_popup.position_2 { top: 140px; left: 0px; }
	.main_popup.position_3 { top: 210px; left: 0px; }
	.main_popup.position_4 { top: 280px; left: 0px; }
	.main_popup.position_5 { top: 350px; left: 0px; }
}
@media all and (max-width:460px){
	.main_popup { margin: 0 10px; }
}

.check_area > input[type="checkbox"]{display: none; }
.check_area > input[type="checkbox"] + label span { display:inline-block; width:20px; height:20px; margin:-2px 10px 0 0; vertical-align:middle; background: #999; border-radius: 3px; cursor:pointer; }
.check_area > input[type="checkbox"]:checked + label span { background:url('../img/checked_01.png') no-repeat; }