@charset "utf-8";
/* CSS Document */

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


#wrap { width:100%; margin:0 auto;}
header {position: fixed; width:100%;height:50px; background: #fff; border-bottom:1px solid #f5f5f5;z-index: 998;-webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; overflow: hidden;}

header h1 { position: absolute; width:99px; height:40px;top:15px;left:3%;}
header h1 a {display: block;
    height: 100%;;
    background-image: url("/images/common/top_logo_over.png");
    background-size: contain;
    background-repeat: no-repeat;}
.single-page-nav {display:none;}

.section {
width:100%; height:auto;
padding: 1.25em 0;
margin: 0 auto;
}
#section1 {
padding-top: 5em;
}
#section2 {
padding-top: 5em;
}
#section3 {
padding-top: 5em;
}
#section4 {
padding-top: 5em;
}
#section5 {
padding-top: 5em;
}
.contents_bg {width:100%; margin:30px auto 0;}
.contents_bg img {max-width:100%; height:auto; }

.top_box {
    display: block; position: absolute; right:3%; top:13px;}
.top_box a {float: left; display:block; }
.top_box a.lang_btn {display:block;}
.top_box a.lang_btn {width:70px; border-radius: 20px;border:3px solid #007ec3; color: #222; text-align: center; text-transform: uppercase; font-size:12px; font-weight:500; }

.main_content {width: 90%; margin: 0 auto; }
.main_img {width:100%;height:280px; padding-top: 0;
    background-image: url("/images/main/main_img_en.jpg");
    background-position: center center;background-repeat: no-repeat; background-size: cover;overflow: hidden;}
h4 {display:block;font-size:18px; font-weight: 700; margin:0 auto 30px;}
h4:after {content:''; display:inline-block;width:5px; height:5px; background-color: #007ec3; border-radius: 50%; margin-left:5px;}
@media screen and (min-width:768px)  {
     
}

@media screen and (min-width:1024px)  { 
    header {height:70px;}
    header h1 {top:22px;}
    .single-page-nav {
background: #fff;
padding: 22px 0;
position: fixed;
top: 0;
left:50%;transform: translateX(-50%);
width:60%; display: block; overflow: hidden;

}

.single-page-nav li {
float: left;
width:20%;
text-align: center;
}
.single-page-nav a {
display: block;
text-decoration: none;
font-size: 18px;
font-weight: 700;
}
.single-page-nav a:hover,  .single-page-nav .current {
color: #007ec3;
}
    .top_box {top:20px;}
    .top_box a.lang_btn {width:100px; font-size:14px;}
    .top_box a.lang_btn:hover {background-color: #007ec3; color: #fff; transition: all 0.3s;}
    .main_img {height:600px;}
    .main_content {width: 57%;min-width: 1000px;}
    
     h4 {display: inline-block;}
    h4:after {width:7px; height:7px;margin-left:5px;}

}
@media screen and (min-width:1200px)  {
    
     .main_content {width: 1100px;}   
header h1 { width:152px; height:34px;top:17px;}
    .single-page-nav a {font-size: 20px;}
    .contents_bg {margin:80px auto 0;}
    h4 {font-size: 28px;font-weight: 500; margin-bottom: 50px}
}
@media screen and (min-width:1440px)  {
    .main_content {width: 1200px;}
     
}
@media screen and (min-width:1920px)  {   
   .main_content {width: 1400px;}
    
}