@charset "utf-8";
/* CSS Document */
body{
	/* overflow-y: auto; */
}

.main{
	width: 100%;
	margin: 0 auto;
	/* height: 100%; */
	/*font-family: Arial, Helvetica, sans-serif;*/
	/* overflow-y: auto; */
	overflow-x: hidden;
	/* -webkit-overflow-scrolling: touch; */

}
/* 印刷用 */
/* overflowを初期値(visible)にしないと1ページ分しか印刷できない */
/* footer固定用にmin-heightに数値を指定している場合、印刷時footerが変にずれるので、ここでcontents{min-height:0(初期値);}を指定 */

@media print {
    body{
        overflow-y: visible;
        overflow-x: visible;
    }
    .main{
        overflow-y: visible;
        overflow-x: visible;
	}

}

.header{
    border-bottom: solid 3px #f33;
}

.title_production{
	margin-top: 100px;
}
.title{
	
}
.title_bg{
	background-color: #fff;
	padding-top: 80px;
	padding-bottom: 50px;
}
.title ul{
	width: 1100px;
	margin: 0 auto;
	display: flex;
    justify-content:center;
}
.title ul li{
	display: flex;
    flex-direction: column;
    width: 48.5%;
    align-items: center;
    /*border: 1px solid #889098;*/
}
.title ul li:first-child,.section1 ul li:first-child{
	margin-right: 2rem;
}
.title h1{
	font-size: 36px;
    font-weight: bold;
    line-height: 1.8em;
    text-align: center;
    margin-top: 2rem;
}
.title h2{
    color: #00A3E0;
	font-size: 32px;
    font-weight: 500;
    letter-spacing: 1.6px;
    line-height: 1.5em;
    margin: 0 0 3rem;
    text-align: center;
}
.title h2 span{
    font-size: 36px;
    font-weight: 700;
}
.title .ttl01{
	font-size: 1.2rem;
    margin-top: 0.6rem;
}
.title p{
	font-size: 1rem;
    letter-spacing: 1.8px;
}
.title_cap_bg{
	background: #122232;
    color: #FFF;
	padding: 1.6rem;
    margin-top: 1rem;
    height: 395px;;
}
.title_cap_bg p{
	line-height: 1.8;
}

/* section */
section{
	padding: 50px 0px;
}
section h2{
	width: 1000px;
	margin:0 auto;
	color: #ff3333;
	font-size: 26px;
	margin-bottom: 20px;
}
video{
	width: 900px;
	margin: 0 auto;
    display: block;
	padding: 50px 0px;
}
.video_02 {
    width: 900px;
    margin: 50px auto;
}

/* section1 */
.section1,.section4{
    max-width: 1100px;
    margin: 0 auto;
}
.section1 ul{
    display: flex;
    margin-bottom: 3rem;
}
.section1 ul li{
    width: 48.5%;
    justify-content:center;
}
.section1 p{
   background: #00A3E0;
   color: #FFF;
   padding: 1rem;
   text-align: center;
   font-size: 1rem;
   letter-spacing: 1.8px;
   position: relative;
   margin-bottom: 1.8rem;
}
.section1 p:after {
    position: absolute;
    top: 100%;
    left: 48.5%;
    border: solid transparent;
    content: " ";
    border-top-color: #00A3E0;
    border-width: 16px;
    margin-left: -16px;
 }
.section1 .taC{
    text-align: center;
}

/* section2 */
.section2 h3{
	width: 900px;
    margin: 0 auto;
    font-size: 24px;
}
.section2 table{
	width: 1000px;
	margin: 0 auto;
	margin-bottom: 50px;
}
.section2 table > tbody > tr{
	border-top: 1px solid #dce0e2;
}
.section2 table > tbody > tr:last-child{
	border-bottom: 1px solid #dce0e2;
}
.section2 table > tbody > tr > th{
	font-weight: bold;
    font-size: 18px;
    padding: 25px 0 0;
    width: 280px;
    position: relative;
    display: inline-block;
}
.section2 p.ttl{
    padding: 1em 0 0.8em 0;
    border-bottom: dotted 1px #dce0e2;
}
.section2 p.ttl_sub{
    padding: 0.8em 0 0 0;
    font-weight: normal;
    font-size: 16px;
}
.section2 table > tbody > tr th span{
	font-size: 13px;
    font-weight: normal;
    margin-left: 0.6rem;
}
.section2 table > tbody > tr > td{
	padding-right: 15px;
	letter-spacing: 0.05em;
    line-height: 1.7;
	padding: 0.5em 0;
}

/* section3 */
.section3{
	width: 1000px;
    margin: 0 auto;
    font-size: 24px;
	color: #fff;
	padding-top: 0;
}
.btn_area{
	display: flex;
	justify-content:space-between;
}
.btn.model{
	width: 220px;
    border-radius: 30px;
}
.btn a {
    text-decoration: none;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    display: block;
}
.comRelated {
    margin: 0 auto 38px;
    width: 960px;
	padding-top: 50px;
}
.comRelated .title {
    margin-bottom: 10px;
    color: #000;
    font-size: 17px;
    font-weight: bold;
    text-align: left;
}
.comRelated .subRelated {
    padding: 20px 17px 10px;
    border: 3px solid #D2D2D2;
}
.comRelated .subRelated li {
    float: left;
    margin: 0 20px 12px 0;
    min-width: 198px;
    font-size: 14px;
}

/* section4 */
.section4 ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 2rem;
}
.section4 ul li:nth-child(odd){
    margin-right: 3rem;
}
.section4 ul li{
    margin-bottom: 3rem;
}
.section4 ul li h3{
    font-size: 1.2rem;
    font-weight: 700;
}
.section4 ul li p{
    font-size: 1rem;
    margin: 0.6rem 0;
}

/* popup */
.white-popup {
  position: relative;
  background: #FFF;
  padding: 10px;
  width: auto;
  max-width: 800px;
  margin: 20px auto;
}
.popup-movie video {
    width: 700px;
    padding: 30px 0;
}
/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}


/* footer_contact */
.footer_contact{
	padding: 35px;
	background-color: #f7f9fb;
}
.footer_contact p{
	width: 1000px;
	margin: 0 auto;
	display: block;
	text-align: center;
	font-size: 26px;
	margin-bottom: 15px;
}
.footer_contact ul{
	width: 580px;
	margin: 0 auto;
	display: block;
}
.footer_contact ul li{
	padding: 10px 0px;
	font-weight: bold;
	text-align: center;
}
.footer_contact_icon_tel,
.footer_contact_icon_mail{
	width: 80px;
	text-align: right!important;
}
.footer_contact_icon_tel img{
	width: 28px;
}
.footer_contact_icon_mail img{
	width: 28px;
}
.footer_contact_text{
	width: 250px;
    font-size: 20px;
}
.footer_contact_tel,
.footer_contact_btn{
	width: 250px;
}
.footer_contact_tel{
    font-size: 30px;
	font-weight: bold;
	letter-spacing: 0.1em;
	text-align: center;
}
.footer_contact_btn{
	width: 250px;
	height: 50px;
    line-height: 50px;
}
.footer_contact .footer_btn_link{
    width: 580px;
    margin: 30px auto 0;
    padding-left: 40px;
}
.footer_btn_link a {
    display: block;
    text-decoration: none;
    border:3px solid #5b656f;
    color: #fff;
    background: #5b656f;
    padding:10px 0;
    border-radius: 3px;
    font-size: 20px;
    font-weight: bold;
}
.footer_btn_link a:hover {
    background: #fff;
    border:3px solid #5b656f;
    color:#5b656f;
}