@charset "utf-8";


.intro1{}
.intro1 .inner{}
.intro1 .inner > .img{}
.intro1 .inner > .img img{}
.intro1 .inner .cont{text-align: center;}
.intro1 .inner .cont .s-inner{ margin-top: -100px; background-color: #fff; position: relative; z-index: 2;}
.intro1 .inner .cont .s-inner .title{width: 340px; height: 64px; line-height: 64px; font-size: 3rem; color: #fff; background-color: #00556f; margin: 0 auto; font-weight: 700; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; margin-bottom: 30px;}
.intro1 .inner .cont .s-inner p{font-size: 2.4rem; font-weight: 500; color: #222222;}
.intro1 .inner .cont .s-inner .img{margin-top: 50px; margin-bottom: 70px;}
.intro1 .inner .cont .s-inner .img img{}
.intro1 .inner .cont .s-inner .flex{display: flex; justify-content: space-between; margin-bottom: 80px;}
.intro1 .inner .cont .s-inner .flex table{text-align: left; width: calc(100% - 5px); line-height: 60px; border-bottom: 1px solid #555555;}
.intro1 .inner .cont .s-inner .flex table thead tr th{border-top: 2px solid #2a93a4; text-align: center; border-bottom: 2px solid #eeeeee; font-size: 1.8rem; color:#222222;}
.intro1 .inner .cont .s-inner .flex table thead tr td{border-top: 2px solid #555555; border-bottom: 2px solid #eeeeee; font-size: 1.7rem; color:#686868;}
.intro1 .inner .cont .s-inner .flex table tbody tr th{text-align: center; border-bottom: 2px solid #eeeeee; font-size: 1.8rem; color:#222222;}
.intro1 .inner .cont .s-inner .flex table tbody tr td{ border-bottom: 2px solid #eeeeee; font-size: 1.7rem; color:#686868; line-height:150%}
.intro1 .inner .cont .s-inner .flex table tbody tr td span{ font-size: 1.5rem; color:#ccc; padding: 0 5px}

.intro1 .inner .cont .s-inner .flex table tbody tr:last-child th,
.intro1 .inner .cont .s-inner .flex table tbody tr:last-child td{border-bottom: 0;}
.intro1 .bg{background-color: #f8f8f8; padding: 50px 0;}
.intro1 .bg .s-inner{}
.intro1 .bg .s-inner ul{}
.intro1 .bg .s-inner ul li{font-size: 1.5rem; font-weight: 400; color: #686868; opacity: 0.8; padding: 10px 0; border-bottom: 1px dashed #e9e9e9;}

@media all and (max-width:976px){
	.intro1 .inner > .img img{width: 100%;}
	.intro1 .inner .cont .s-inner .title{width: 240px; font-size: 2.4rem; line-height: 56px; height: 56px; margin-bottom: 20px;}
	.intro1 .inner .cont .s-inner p{font-size: 2rem;}
	.intro1 .inner .cont .s-inner .img{margin-top: 35px; margin-bottom: 50px;}
	.intro1 .inner .cont .s-inner .img img{max-width: 280px;}
	.intro1 .inner .cont .s-inner .flex{flex-direction: column; margin-bottom: 30px;}
	.intro1 .inner .cont .s-inner .flex table{width: 100%; margin-bottom: 30px; line-height: 52px;}
	.intro1 .bg{padding: 40px 0;}
}
@media all and (max-width:640px){
	.intro1 .inner .cont .s-inner{margin-top: 0;}
	.intro1 .inner .cont .s-inner .title{width: 200px; font-size: 2.1rem; line-height: 46px; height: 46px;}
	.intro1 .inner .cont .s-inner p{font-size: 1.7rem;}
	.intro1 .inner .cont .s-inner .img img{max-width: 220px;}
	.intro1 .inner .cont .s-inner .flex table{margin-bottom: 25px;}
	.intro1 .inner .cont .s-inner .flex table thead tr th{font-size: 1.7rem;}
	.intro1 .inner .cont .s-inner .flex table thead tr td{font-size: 1.6rem;}
}


/* ul.tab */
.tab{display: flex;}
.tab li{text-align: center; width: 100%; color: #9c9c9c; padding: 12px 0; border-bottom: 1px solid #ccc; cursor: pointer; font-size: 1.8rem; position: relative;}
.tab li.on{color: #004668; border-bottom: 4px solid #004668; font-weight: 500;}
.tab li:hover{color: #004668; border-bottom: 4px solid #004668;}
.tab li::after {
  content: '';
  display: inline-block;
  width: 1px;
  height: 12px;
  position: absolute;
  right: 0;
  top: 16px;
  background: #ccc;
}
.tab li:last-child::after{display: none;}

.tabcontent{display: none; margin-top: 60px;}
.tabcontent.on{display: block;}

.info_btn{margin: 30px auto; display: block; text-align: center;}
.info_btn img{max-width: 240px;}

@media all and (max-width:976px){
    .info_btn img{max-width: 180px;}
    .tab{flex-wrap: wrap;}
    .tab li{width: 33.33333%;}
    .tab li:nth-child(3n)::after{display: none}
}
@media all and (max-width:640px){
    .tab li{width: 50%;}
    .tab li:nth-child(3n)::after{display: block;}
    .tab li:nth-child(2n)::after{display: none;}
}


.down{display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px;}
.down a{background-color: #00557a; color: #fff; font-size: 1.6rem; font-weight: 500; padding: 12px 16px; display: flex; justify-content: flex-end; align-items: center; margin-right: 30px;}
.down a span{margin-left: 5px;}

@media all and (max-width:768px){
    .down{justify-content: center;}
    .down a{font-size: 1.5rem; margin-right: 0;}
    .down span{font-size: 2rem;}
}

.tabs{display: flex; justify-content: center; position: relative; top: 50px;}
.tabs li{width: 50%; max-width: 400px;}
.tabs li a{display: flex; align-items: center; background-color: #00557a; padding: 20px; color: #fff;position: relative;}
.tabs li:nth-child(2) a{background-color: #336844;}
.tabs li a .txt{margin-left: 20px;}
.tabs li a .txt p{font-size: 1.6rem; font-weight: 300;}
.tabs li a .txt h3{font-size: 2.4rem; line-height: 1.4em;}
.tabs li a .txt h3 span{ font-weight: 400;}
.tabs li a > span{font-size: 3rem; position: absolute; background-color: rgba(0,0,0,0.2); right: 0; height: 100%; display: flex; align-items: center; padding: 0 20px;}

@media all and (max-width:786px){
    .tabs{flex-wrap: wrap; top: 0;}
    .tabs li{width: 100%; max-width: 100%;}
    .tabs li a{padding: 15px;}
    .tabs li a .txt{margin-left: 10px;}
    .tabs li a .txt p{font-size: 1.4rem;}
    .tabs li a .txt h3{font-size: 2rem;}
    .tabs li a > span{font-size: 2.4rem;}
}

.img_inner{position: relative;}
.img_inner img{}
.img_inner small{position: absolute; right: 10px; bottom: 10px; color: #000;}

.pdf{}
.pdf .btn{background-color: #03557a; text-align: center; padding: 15px 20px;}
.pdf .btn a{}
.pdf .btn a img{max-width: 100%;}

@media all and (max-width:640px){
    .pdf .btn a img{max-width: 80%;}
}