@charset "utf-8";
/* Box01 */
#box01 .outer{margin: 0 0 30px;}
#box01 .img{text-align: center;}
#box01 .list{padding: 0 0 0 35px;}
#box01 .list li{margin: 0 0 2em;}
#box01 .mTit04{margin: 0 0 10px; position: relative;}
#box01 .mTit04::before{content: ""; display: block; width: 20px; height: 4px; background: #fff; position: absolute; top: 17px; left: -35px;}

@media screen and (min-width: 769px) {
	#box01{margin: 0 0 110px;}
    #box01 .head{margin: 0 0 60px;}
    #box01 .headTxt{width: 50%;}
    #box01 .headTit{width: 48%;}
    
    #box01 .inner{width: 55%}
    #box01 .img{width: 38%;}
}

@media screen and (max-width: 768px) {
	#box01{margin: 0 0 60px;}
    #box01 .head{margin: 0 0 50px; display: block;}
    #box01 .headTit{margin: 0 0 20px;}
    
    #box01 .outer{display: block;}
    #box01 .img{padding: 0 10%;}    
    #box01 .mTit04::before{height: 3px; top: 3vw;}
}

/* Box02 */
#box02 .desc p:not(:last-of-type){margin: 0 0 2em;}

@media screen and (min-width: 769px) {
    #box02{margin: 0 0 200px;}
    #box02 .head{max-width: 1400px; margin: 0 auto 70px; width: 100%; align-items: center;}
    #box02 .img{width: 42.86%;}
    #box02 .outer{width: 50%; padding: 0 20px 0 0;}
    #box02 .inner{max-width: 540px; width: 100%;}
    
    #box02 .mTit04{margin: 15px 0 70px;}
    #box02 .txt{font-size: 2.2rem; line-height: 1.8;}
}

@media screen and (max-width: 768px) {
	#box02{margin: 0 0 80px;}
    #box02 .head{display: block; margin: 0 0 40px;}
    #box02 .img{width: calc(100% - 15px);}
    #box02 .img img{width: 100%;}
    #box02 .outer{padding: 30px 30px 0;}
    
    #box02 .mTit04{margin: 15px 0 35px;}
    #box02 .txt{font-size: min(4.2vw,2.2rem); line-height: 1.8;}
}

/* Outline*/
#outline .mTit{line-height: 1; margin: 0 0 80px; text-align: center;}
#outline .mainImg{margin: 0 0 100px; overflow: hidden;}
#outline .mainImg img{width: 100%;}

#outline .mTit03{margin: 0 0 35px;}
#outline .box{margin: 0 0 100px;}

@media screen and (max-width: 768px) {
    #outline .mTit{margin: 0 0 35px;}
    
    #outline .mainImg{margin: 0 0 40px;}
    
    #outline .mTit03{margin: 0 0 25px;}
    #outline .box{margin: 0 0 80px;}
}

/* Company */
.companyTbl a:hover{text-decoration: underline; text-underline-offset: 0.25em;}
.companyTbl iframe{width: 100%; height: 270px; margin: 22px 0 0 0;}

@media screen and (min-width: 769px) {
    #company{padding: 0 0 40px;}
    #company .mTit03{width: 32%;}
    #company .inner{width: 68%;}
    
    .companyTbl{width: 100%;}
    .companyTbl th,
    .companyTbl td{border-bottom: 1px solid #fff; padding: 22px 0; vertical-align: top;}

    .companyTbl tr:nth-of-type(1) th,
    .companyTbl tr:nth-of-type(1) td{padding-top: 0;}

    .companyTbl th{width: 26.7%;}
}

@media screen and (max-width: 768px) {
	#company{display: block;}
    
    .companyTbl,
    .companyTbl tbody,
    .companyTbl tr,
    .companyTbl th,
    .companyTbl td{width: 100%; display: block;}
    
    .companyTbl tr{border-bottom: 1px solid #fff; padding: 20px 0;}
    .companyTbl th{margin: 0 0 5px;}
}

/* History*/
.historyTbl{width: 100%; border-bottom: 1px solid #fff;}
.historyTbl th.year{font-size: 4rem; line-height: 0.35; font-family: "Playfair Display", sans-serif; font-weight: 400; width: 140px;}
.historyTbl th.month{font-size: 2.4rem; line-height: 1.1; font-family: "Playfair Display", sans-serif; font-weight: 400; width: 110px;}

@media screen and (min-width: 769px) {
    .historyTbl th,
    .historyTbl td{border-top: 1px solid #fff; padding: 40px 0; vertical-align: top;}

    .historyTbl tr:nth-of-type(1) th,
    .historyTbl tr:nth-of-type(1) td{border-top: none; padding-top: 20px;}
    .historyTbl tr.child th,
    .historyTbl tr.child td{border-top: none; padding-top: 0;}
}

@media screen and (max-width: 1000px) {
    .historyTbl th.year {font-size: 3rem;}
    .historyTbl th.month {font-size: 2rem;}
}

@media screen and (max-width: 768px) {    
    .historyTbl,
    .historyTbl tbody,
    .historyTbl tr,
    .historyTbl th,
    .historyTbl td{width: 100%; display: block;}
    
    .historyTbl tr{display: flex; flex-wrap: wrap; border-top: 1px solid #fff; padding: 20px 0;}
    .historyTbl th.year{width: 100%; line-height: 1; margin: 0 0 15px;}
    .historyTbl th.month{width: 90px; line-height: 1; padding: 0;}
    .historyTbl td{width: calc(100% - 90px);}
    
    .historyTbl tr:nth-of-type(1){border-top: none; padding-top: 10px;}
    .historyTbl tr.child{border-top: none; padding-top: 0;}
}