/* ¸ÞÀÎ¿µ¿ª ½ºÅ¸ÀÏ ½ÃÆ® */
body {height:100%;overflow-y:auto;-webkit-overflow-scrolling: touch;}

/* mobile -wide*/
@media only screen and (max-width:1023px){

div#han_wrap { width:100%;height:100%; margin-top:94px; } 

div#content { width:100%; margin:20px auto;}
div#content div#visual { margin-top:2px; width:100%;height:200px;font-size:50px; text-align:center;color:#222;}
div#content div#visual img {height:200px}

div#cont1 { width:96%; margin:10px auto; padding:10px 0 10px;border:2px solid #222; }
div#cont1 ul.jijem { width:98%; margin:10px auto; }  /* ¸Þ´º 3°³  */
div#cont1 ul.jijem li { float:left; width:18%; font-size:15px; }
div#cont1 ul.jijem li:nth-of-type(1) { border-left: 1px solid #b4b3b3; }
div#cont1 ul.jijem li.tabon  { display:block; padding:10px 10px; text-align:center; color:#fff; background-color:#747474;border:1px solid #747474; cursor:pointer; }
div#cont1 ul.jijem li.taboff { display:block; padding:10px 10px; text-align:center; color: #222; background-color:#fff; border:1px solid #747474; cursor:pointer; }

div#cont2{ display:table; width:100%; margin:2px auto;text-align:center;border-top:1px solid #f6f6f6;}
div#cont2 ul { width:98%; margin:0 auto; } 
div#cont2 h3 { padding:10px;color:#222; font-size:18px;letter-spacing:.5px; }
div#cont2 p { padding:10px;color:#666; font-size:15px;letter-spacing:.5px; }

div#cont2 div.tt_img { display:block;width:100%; }
div#cont2 div.tt_img ul li { display:inline-block; width:43%; /*±âÁ¸ width:23%*/ margin:4px; /*float:left;*/border-radius:1rem;background:#f9f9f9; }
div#cont2 div.tt_img ul li img { display:block;width:100%;border-radius:1rem;}

div#cont3{ display:table; width:100%; margin:2px auto;text-align:center;border-top:1px solid #f6f6f6;}
div#cont3 ul { width:98%; margin:0 auto; } 
div#cont3 h3 { padding:10px;color:#222; font-size:18px;letter-spacing:.5px; }
div#cont3 p { padding:10px;color:#666; font-size:15px;letter-spacing:.5px; }

div#cont4 { position:relative;width:100%;margin:30px auto;text-align:center;}
div#cont4 h3 { padding:10px;color:#fff; font-size:25px;letter-spacing:2px; }
div#cont4 p { padding:10px;color:#f6f6f6; font-size:18px;letter-spacing:1px; }

#btns1 {width:46.0%;text-align:center;float:left;background:#fff;border:1px solid #555;padding:4px 1px;border-radius:.5rem;}
#btns1 a { display:inline-block;width:100%;text-align:center;text-decoration:none;font-size:11px;}
#btns1 a:hover { color:#111;;background:#ddd;border-radius:2rem;}

#btns2 {width:46.0%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;padding:4px 1px;border-radius:.5rem;}
#btns2 a { display:inline-block; width:100%;text-align:center;text-decoration:none;font-size:11px;  color:#fff;}
#btns2 a:hover { color:#111; background:#ddd;border-radius:2rem;}

#btns3 {width:90%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;padding:4px 1px;border-radius:.5rem;}
#btns3 a { display:inline-block; width:100%;text-align:center;text-decoration:none;font-size:11px;  color:#fff;}
#btns3 a:hover { color:#111; background:#ddd;border-radius:2rem;}

#radi{ margin:1px auto; width:100px; font-size:15px;text-align:center; padding:15px;border:1px solid #5a6671;color:#5a6671;letter-spacing:2px;cursor:pointer; } 
#radi:hover{ color:#fff; } 

a.expand {  margin:0px auto;display: block;position:absolute;z-index:100;width:92%;height:100%;text-align:center; color: #fff;font-size:15px;border-radius:2rem; }

.reveal-modal-bg { position:fixed;height:100%; width:100%;background:#000; background:rgba(0,0,0,.8); z-index:100; display: none;top:0;left:0; }
.reveal-modal { 
    visibility: hidden;top:150px;left:10%;width:60%; background: #eee url(modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding: 30px 40px 34px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
	
.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}

.reveal-modal .close-reveal-modal {	font-size: 22px; line-height: .5; position: absolute; top: 8px;	right: 11px; color: #aaa;text-shadow: 0 -1px 1px rbga(0,0,0,.6);font-weight: bold; cursor: pointer; } 

div#popup { position:absolute;top:80px;left:5%;width:86%;margin:10px auto;z-index:99999;display:none;border:1px solid #222; }
div#popup div.popup_table { position: relative; width:96%; margin:0px auto;  }
div#popup div.popup_table div#X { width:20px;height:20px;color:#fff;background:#af2949;font-size:16px;text-align:center; }
div#popup div.popup_table span { font-size:13px;  }

table.pop_up {width:100%; margin:10px auto;border:3px solid #fff; background:#fff;}
table.pop_up tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:14px; text-align:center;}
table.pop_up tr th.t_tit { background:#f5f5f5; color:#314072; font-weight:bold;font-size:13px;}
table.pop_up tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.pop_up tr td.a_left {text-align:left; padding-left:20px; line-height:2;font-size:13px;}
table.pop_up tr td.a_tab {text-align:center; padding-top:38px; font-size:13px;}
table.pop_up tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

}

/* pc */

@media only screen and (min-width:1023px) and (max-width:1599px) {

div#m_cont { display:none; } 
div#han_wrap { width:100%;height:100%; margin-top:100px; } 

div#content { width:100%; margin:20px auto;}
div#content div#visual { margin-top:2px; width:100%;height:650px;font-size:50px; text-align:center;color:#222;}
div#content div#visual img {height:650px}

div#cont1 { width:96%; margin:10px auto; padding:10px 0 10px;border:2px solid #222; }
div#cont1 ul.jijem { width:98%; margin:10px auto; }  /* ¸Þ´º 3°³  */
div#cont1 ul.jijem li { float:left; width:18%; font-size:15px; }
div#cont1 ul.jijem li:nth-of-type(1) { border-left: 1px solid #b4b3b3; }
div#cont1 ul.jijem li.tabon  { display:block; padding:10px 10px; text-align:center; color:#fff; background-color:#747474;border:1px solid #747474; cursor:pointer; }
div#cont1 ul.jijem li.taboff { display:block; padding:10px 10px; text-align:center; color: #222; background-color:#fff; border:1px solid #747474; cursor:pointer; }

div#cont2{ display:table; width:98%; margin:20px auto;padding-top:40px;text-align:center;border-top:1px solid #f6f6f6;}
div#cont2 ul { width:92%; margin:0 auto; } 
div#cont2 h3 { padding:10px;color:#222; font-size:25px;letter-spacing:2px; }
div#cont2 p { padding:10px;color:#666; font-size:18px;letter-spacing:1px; }

div#cont2 div.tt_img { display:block;width:100%; }
div#cont2 div.tt_img ul li { display:inline-block; width:22.5%; /*±âÁ¸ width:23%*/ margin:0.7%; /*float:left;*/border-radius:2rem;background:#f9f9f9; }
div#cont2 div.tt_img ul li img { display:block;width:100%;border-radius:2rem;}

div#cont3{ display:table; width:98%; margin:20px auto;padding-top:40px;text-align:center;border-top:1px solid #f6f6f6;}
div#cont3 ul { width:92%; margin:0 auto; } 
div#cont3 h3 { padding:10px;color:#222; font-size:25px;letter-spacing:2px; }
div#cont3 p { padding:10px;color:#666; font-size:18px;letter-spacing:1px; }

div#cont4 { position:relative;width:100%;margin:30px auto;text-align:center;}
div#cont4 h3 { padding:10px;color:#fff; font-size:25px;letter-spacing:2px; }
div#cont4 p { padding:10px;color:#f6f6f6; font-size:18px;letter-spacing:1px; }

#btns1 {width:45.0%;text-align:center;float:left;background:#fff;border:1px solid #555;border-radius:2rem;}
#btns1 a { display:inline-block;width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;}
#btns1 a:hover { color:#111;;background:#ddd;border-radius:2rem;}

#btns2 {width:45.0%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;border-radius:2rem;}
#btns2 a { display:inline-block; width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;  color:#fff;}
#btns2 a:hover { color:#111; background:#ddd;border-radius:2rem;}

#btns3 {width:96%;text-align:center;float:left;background:#fff;border:1px solid #555;border-radius:2rem;}
#btns3 a { display:inline-block;width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;}
#btns3 a:hover { color:#111;;background:#ddd;border-radius:2rem;}

#radi{ margin:1px auto; width:100px; font-size:15px;text-align:center; padding:15px;border:1px solid #5a6671;color:#5a6671;letter-spacing:2px;cursor:pointer; } 
#radi:hover{ color:#fff; } 

a.expand {  margin:0px auto;display: block;position:absolute;z-index:100;width:92%;height:100%;text-align:center; color: #fff;font-size:17px; }

.reveal-modal-bg { position:fixed;height:100%; width:100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none;top:0;left:0; }
.reveal-modal { 
    visibility: hidden;top:100px;left:40%; margin-left:-300px;width:40%; background: #eee url(modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding: 30px 40px 34px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
	
.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}

.reveal-modal .close-reveal-modal {	font-size: 22px; line-height: .5; position: absolute; top: 8px;	right: 11px; color: #aaa;text-shadow: 0 -1px 1px rbga(0,0,0,.6);font-weight: bold; cursor: pointer; } 

div#popup { position:absolute;top:80px; left:35%; width:550px; margin:100px auto; opacity:1.0;z-index:9999;display:none; }
div#popup div.popup_table { position: relative; width:520px; margin:0px auto;  }
div#popup div.popup_table div#X { width:20px;height:20px;color:#fff;background:#af2949;font-size:16px;text-align:center; }
div#popup div.popup_table span { font-size:13px;  }

table.pop_up {width:100%; margin:30px auto; border:3px solid #fff; background:#fff;}
table.pop_up tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:14px; text-align:center;}
table.pop_up tr th.t_tit { background:#f5f5f5; color:#314072; font-weight:bold;font-size:13px;}
table.pop_up tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.pop_up tr td.a_left {text-align:left; padding-left:20px; line-height:2;font-size:13px;}
table.pop_up tr td.a_tab {text-align:center; padding-top:38px; font-size:13px;}
table.pop_up tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

}

@media only screen and (min-width:1600px){

div#m_cont { display:none; } 
div#han_wrap { width:100%;height:100%; margin-top:100px; } 

div#content { width:100%; margin:20px auto;}
div#content div#visual { margin-top:2px; width:100%;height:700px;font-size:50px; text-align:center;color:#222;}
div#content div#visual img {height:700px}

div#cont1 { width:96%; margin:10px auto; padding:10px 0 10px;border:2px solid #222; }
div#cont1 ul.jijem { width:98%; margin:10px auto; }  /* ¸Þ´º 3°³  */
div#cont1 ul.jijem li { float:left; width:18%; font-size:15px; }
div#cont1 ul.jijem li:nth-of-type(1) { border-left: 1px solid #b4b3b3; }
div#cont1 ul.jijem li.tabon  { display:block; padding:10px 10px; text-align:center; color:#fff; background-color:#747474;border:1px solid #747474; cursor:pointer; }
div#cont1 ul.jijem li.taboff { display:block; padding:10px 10px; text-align:center; color: #222; background-color:#fff; border:1px solid #747474; cursor:pointer; }

div#cont2{ display:table; width:68%; margin:20px auto;padding-top:40px;text-align:center;border-top:1px solid #f6f6f6;}
div#cont2 ul { width:100%; margin:0 auto; } 
div#cont2 h3 { padding:10px;color:#222; font-size:25px;letter-spacing:2px; }
div#cont2 p { padding:10px;color:#666; font-size:18px;letter-spacing:1px; }

div#cont2 div.tt_img { display:block;width:100%;border-radius:2rem; }
div#cont2 div.tt_img ul li { display:inline-block;width:22.5%;margin:0.7%;border-radius:2rem; /*float:left;*/ background:#f9f9f9;}
div#cont2 div.tt_img ul li img { display:block;width:100%;border-radius:2rem;}

div#cont3 { position:relative;width:68%;margin:0px auto; overflow:hidden;text-align:center; }
div#cont3 ul { width:100%; margin:0 auto; } 
div#cont3 h3 { padding:10px;color:#222; font-size:25px;letter-spacing:2px; }

div#cont4 { position:relative;width:100%;margin:30px auto;text-align:center;}
div#cont4 h3 { padding:10px;color:#fff; font-size:25px;letter-spacing:2px; }
div#cont4 p { padding:10px;color:#f6f6f6; font-size:18px;letter-spacing:1px; }

#btns1 {width:45.0%;text-align:center;float:left;background:#fff;border:1px solid #555;border-radius:2rem;}
#btns1 a { display:inline-block;width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;}
#btns1 a:hover { color:#111;;background:#ddd;border-radius:2rem;}

#btns2 {width:45.0%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;border-radius:2rem;}
#btns2 a { display:inline-block; width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;  color:#fff;}
#btns2 a:hover { color:#111; background:#ddd;border-radius:2rem;}

#btns3 {width:96%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;border-radius:2rem;}
#btns3 a { display:inline-block; width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;  color:#fff;}
#btns3 a:hover { color:#111; background:#ddd;border-radius:2rem;}

#radi{ margin:1px auto; width:100px; font-size:15px;text-align:center; padding:15px;border:1px solid #5a6671;color:#5a6671;letter-spacing:2px;cursor:pointer; } 
#radi:hover{ color:#fff; } 

a.expand {  margin:0px auto;display: block;position:absolute;z-index:100;width:92%;height:100%;text-align:center; color: #fff;font-size:17px;border-radius:2rem; }

.reveal-modal-bg { position:fixed;height:100%; width:100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none;top:0;left:0;border-radius:2rem; }
.reveal-modal { 
    visibility: hidden;top:100px;left:40%; margin-left:-300px;width:40%; background: #eee url(modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding: 30px 40px 34px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
	
.reveal-modal.small 		{ width: 200px; margin-left: -140px;border-radius:2rem;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;border-radius:2rem;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;border-radius:2rem;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;border-radius:2rem;}

.reveal-modal .close-reveal-modal {	font-size:22px; line-height:.5;position:absolute;top: 8px;right: 11px; color: #aaa;text-shadow: 0 -1px 1px rbga(0,0,0,.6);font-weight: bold; cursor: pointer; } 

div#popup { position:absolute;top:80px; left:35%; width:550px; margin:100px auto; opacity:1.0;z-index:9999;display:none;}
div#popup div.popup_table { position: relative; width:520px; margin:0px auto;  }
div#popup div.popup_table div#X { width:20px;height:20px;color:#fff;background:#af2949;font-size:16px;text-align:center; }
div#popup div.popup_table span { font-size:13px;  }

table.pop_up {width:100%; margin:30px auto; border:3px solid #fff; background:#fff;}
table.pop_up tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:14px; text-align:center;}
table.pop_up tr th.t_tit { background:#f5f5f5; color:#314072; font-weight:bold;font-size:13px;}
table.pop_up tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.pop_up tr td.a_left {text-align:left; padding-left:20px; line-height:2;font-size:13px;}
table.pop_up tr td.a_tab {text-align:center; padding-top:38px; font-size:13px;}
table.pop_up tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

}
