@charset "UTF-8";

 /* Page Title */

#main {width:100%;  box-sizing:border-box;  padding:40px 0 0 0;}
#main .wrap {width:100%; box-sizing:border-box; display:inline-block; min-width:1240px; }


div.box_wrap {width:1240px; margin:0 auto; display:flex; justify-content :space-between }
div.box_wrap .t_box {width:37%;  box-sizing:border-box; padding:0; }
div.box_wrap .t_box h3 {font-size:30px; text-transform:uppercase ; font-weight:800; color:#333; width:100%;  }
/*div.box_wrap .t_box p {font-size:17.5px; font-weight:300; color:#888; width:100%;  display:inline-block; margin:30px 0; }*/

div.box_wrap .t_box span.span_bar {width:30px; height:1px; background-color:#333; display:inline-block; margin:30px 0;}
div.box_wrap .t_box a {font-size:13px; font-weight:400; color:#888 !important;  padding:0 40px; line-height:38px; border:1px solid #ddd;  display:inline-block; }

div.box_wrap .img_box {width:60%; box-sizing:border-box;  }
div.box_wrap .img_box img {width:100%}

.text_01 {font-size:0.92em; color:#555; font-weight:400; line-height:1.45em;}
.text_02 {font-size:1em; color:#444; font-weight:400; line-height:1.5em;}
.text_03 {font-size:1.05em; color:#333; font-weight:600; line-height:1.6em;}
.text_04 {font-size:1.1em; color:#333; font-weight:600; line-height:1.6em;}
.text_05 {font-size:1.2em; color:#333; font-weight:600; line-height:1.6em;}

.f_500 {font-weight:500}
.f_600 {font-weight:600}


.section h1{text-align:center; font-size:1.7em; margin-bottom:30px;}
.section h1 span{color:#c00;}


/* SUB VI */
#sub_vi {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  overflow:hidden;
  height:190px;
 }

#sub_vi .sub_vi_h2 {position:absolute; top:50%; left:50%; color:#fff; z-index:999; line-height:2em;
transform:translate(-50%,-50%); font-size:1.8em; font-weight:600; text-shadow:3px 2px 1px rgba(0,0,0,0.2)}
#sub_vi h1 {font-size:1.4em;  color:#333; font-weight:800;  line-height:1.1em;  letter-spacing:-1px;}
#sub_vi h1 span {color:#dc0314; }
#sub_vi p {font-size:1.05em;color:#ddd;  position:absolute; top:60%; left:50%;transform:translateX(-50%);   font-weight:300; letter-spacing:-1px;   }


 #sub_vi>img {
  min-width:100%;
  margin-top:-100px;
  will-change: transform;
  animation-duration: 8s;
  animation-name: background-image-animation;
  animation-iteration-count: 1;
  animation-direction: alternate;
  animation-timing-function: linear;
  transform: translateX(0) scale(1);
}

@keyframes background-image-animation {
  0% {
    transform:  scale(1.2);
  }
  100% {
    transform:  scale(1);
  }
}


#section01 {width:100%; float:Left; margin-top:5%;}
#section01 .section01_wrap {width:100%; float:left; padding:0 4%; box-sizing:border-box}

#section01 .section01_wrap ul.s1_box_wrap	 {display:flex; width:100%; float:left; justify-content: space-between; }
#section01 .section01_wrap ul.s1_box_wrap li {float:left; margin-right:3%; text-align:center; height:auto; padding:40px 0; border-radius:30px 0}
#section01 .section01_wrap ul.s1_box_wrap li:last-child {margin:0;}
#section01 .section01_wrap ul.s1_box_wrap li a{color:#fff; padding:0; }
#section01 .section01_wrap ul.s1_box_wrap li:hover{box-shadow:2px 2px 5px rgba(0,0,0,0.5); transition:ease-in-out 0.5s}

#section01 .section01_wrap ul.s1_box_wrap_col	 {display:flex; width:100%; float:left; flex-direction:column-reverse}
#section01 .section01_wrap ul.s1_box_wrap li img {width:100%;}
#section01 .section01_wrap ul.s1_box_wrap li h3 {color:#fff; margin-bottom:12px; font-size:1.1em; font-weight:600; text-shadow:2px 2px 4px rgba(0,0,0,0.35)}
#section01 .section01_wrap ul.s1_box_wrap li a {background:#fff; color:#333; font-weight:400; font-size:0.85em; z-index:999999; padding:5px 15px; box-sizing:border-box;  border:1px solid #fff; display:inline-block; opacity:0.85}


#section02 {width:100%; float:Left; margin-top:5%; background:url('/mobile/img/main/m_s2_bg_img.png') no-repeat center center; height:auto; padding:6% 0; background-size:cover}
#section02 .section02_wrap {width:100%; float:left; padding:0 4%; box-sizing:border-box;}
#section02 .section02_wrap h1 {color:#fff; text-align:left;}
#section02 .section02_wrap p {color:#fff; text-align:left;  opacity:0.8}

#section03 {width:100%; float:left; margin-top:50px; }
#section03 .s3_pf_wrap {width:100%; float:left;}
#section03 .s3_pf_wrap ul  {width:100%; float:left; justify-content: space-between; display:flex; }
#section03 .s3_pf_wrap ul li {width:50%; float:left;}
#section03 .s3_pf_wrap ul li img{width:100%;}


#section03 .gallery div {
    display: inline-block;
/*    height: 144px;*/
/*    margin: 5px;*/
/*    width: 230px;*/
}
#section03 .gallery a {
    position: relative;
    display: block;
/*    width: 230px;*/
}

#section03 .overlay {
    background-color: rgba(0, 0, 0, 0.85);
    color: #fff;
    cursor: pointer;
    display: block;
/*    height: 120px;*/
	height:100%;
    top: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    text-align: center;
    transition: all 0.3s ease 0s;
    width: 100%;
    z-index: 20;
}


#section03 .overlay p {font-size: 1em; width:100%; margin:0 auto; font-weight:600; display:inline-block;position:absolute;left:50%;top:30%;transform:translate(-50%,50%);}
#section03 .overlay span.date {color:#ddd; position:absolute;left:50%;top:40%;transform:translate(-50%,50%); font-size:0.9em; }

#section03  a:hover .overlay {opacity: 0.8;}



ul.tab_mn  {width:100%; float:left; background:#fff; border-top:1px solid #ddd;}
ul.tab_mn li   {width:50%; box-sizing:border-box; font-size:0.92em;padding:12px 0; font-weight:600;
      text-align:center; float:left; list-style:none;}
/*.ov  {background-color:#444; }*/


ul.tab_mn a {
 	color: #333; display:block;
 }
ul.tab_mn a:link {
	text-decoration: none;
}
ul.tab_mn a:visited {
	text-decoration: none;
	color: #333;
}
ul.tab_mn a:hover {
	text-decoration: none;
	color: #333;
}
ul.tab_mn a:active {
	text-decoration: none;
	color: #333;}

ul.tab_mn .ov a {
 	color: #fff;
 }
ul.tab_mn .ov  a:link {
	text-decoration: none;
}
ul.tab_mn .ov  a:visited {
	text-decoration: none;
	color: #fff;
}
ul.tab_mn .ov  a:hover {
	text-decoration: none;
	color: #fff;
}
ul.tab_mn .ov  a:active {
	text-decoration: none;
	color: #fff;
	background:#555;
}


a.fixed_top {width:65px; line-height:65px; text-align:center;  background-color:#555;  color:#fff !important; border-radius:3px; font-size:15px; display:inline-block; position:fixed; bottom:10%; right:2%;}

footer {width:100%; float:left; text-align:left; font-size:0.88em; color:#999; line-height:1.6em; padding:30px 3%; box-sizing:border-box; background:#333; display:inline-block}
footer span {color:#777; font-size:0.9em}