@charset "utf-8";

/* layout */
#wrapper {}
main {}
#subBanner { width: 100%; height: 40vh; background: url('../img/sub_banner.png') no-repeat center/cover;}
#greeting { }
.subInner { max-width: 1200px; height: 100%; width: 80%; margin: auto;}

.list-wrap .list-container { overflow:hidden; margin-right:-15px; margin-bottom:0px; }
	.list-wrap .list-row { float:left; width:33.33%; }
	.list-wrap .list-item { margin-right:15px; margin-bottom:30px; }

/* subBanner */
.greetInner img {max-width: 100%;}
.bannerInner {
    color: var(--light);
    text-align: right;
    padding-top: 129px;
}
.subInner>h2 {
    font-weight: 700;
    font-size: 2.7rem;
}
/* greeting */
.greetInner {
    display: flex;
    padding :2vw 0 7vw;
    gap: 3vw;
}
.widgetBox { width: 20%; }
.widgetBox h3 {
    font-size: 1.3vw;
    padding: 5%;
    font-weight: 700;
}
.widgetBox ul {}
.widgetBox ul li{
    border-bottom: 1px solid var(--darkFont);
    padding: 4% 5%;
}
.widgetBox ul li:first-child {border-top: 3px solid var(--border); }
.widgetBox ul li a {display: block;}
.pageBox { width: 80%; }
.pageBox .pageCont {
    display: none;
}
.pageInner {display: flex; align-items: center;}
.pageLeft {width: 70%; padding-right: 3vw;}
.pageRight {width: 30%;}

.pageLeft em {
    font-size: 1.3rem;
    line-height: 3rem;
    color: var(--point);
}
.pageCont h3 {
    font-weight: 700;
    font-size: 2rem;
    padding-bottom: 2vw;
}
.certificWrap {
    overflow: hidden;
}
.certificWrap li {
    float: left;
    width: 33%;
}
.certific {
    float: left;
    width: 33%;
}
.profileImg {
    width: 30%;
    margin: auto;
}
.profileTxt p {
    font-size: 1.3rem;
    font-weight: 700;
}
/* location */
.greetingMapCont {display: block;}
.greetingMap {width: 100%;}
.greetingMap img {height: 21vw;}
.greetingMapCont .locaInfo {
    width: 100%;
    color: var(--main);
    font-size: 1rem;
    font-weight: 400;
    margin: 2vw 0;
    border: 1px solid var(--darkFont)
}
.greetingMapCont .locaInfo em {
    padding: 1% 7%;
    font-weight: 700;
    border-right: 1px solid var(--darkFont);
}
.greetingMapCont .locaInfo p {padding: 1% 2%;}
.address , .inquiry  {
    display: flex;
    border-bottom: 1px solid var(--darkFont);
}
.page-content table {border-collapse: collapse;}
.page-content img {max-width: 100%;}
.page-content { word-break: keep-all; line-height:1.6; word-wrap: break-word; margin-bottom:150px; }
    
    .page-content .con01 { position:relative;}
    .page-content .con01 .pic { overflow: hidden; height:290px; text-align:center; }
    .page-content .con01 .pic img { width:250px;}
    .page-content .con01 ul { padding: 0 0 40px 0 ;}
    .page-content .con01 p,
    .page-content .con01 caption { position: relative; padding:0 0 20px ; color: #333; font-size: 23px; font-weight: 700; text-indent: 24px; text-align: left;}
    .page-content .con01 p:before,
    .page-content .con01 caption:before { content: ''; position: absolute; left:0; top:12px; display: block; width: 12px; height: 12px;  background: #f3a211; }
    .page-content .con01 table tr,
    .page-content .con01 ul li { list-style: none; margin: -1px 0 0; padding: 7px 10px; font-size:16px; border:1px solid #ddd; }
    .page-content .con01 table tbody tr.bg,
    .page-content .con01 ul li:nth-of-type(odd) {background:#f5f5f5;}
    .page-content .con01 ul li b { font-weight: 500;  }
    .page-content .con01 ul li dl { display: flex; align-items: center; margin: 0 -5px;}
    .page-content .con01 ul li dl dt { margin: 0 5px; font-weight: 500; font-size: 15px;}
    .page-content .con01 ul li dl dd { margin: 0 5px; }

    strong {display: block; margin-top: 10px;}
   
@media (max-width: 1024px) {
    /* greeting.html */
    .greetInner {flex-wrap: wrap-reverse;}
    .pageBox , .widgetBox {
    width: 100%;
    padding: 5vw 0;
    }
    .widgetBox h3 {
        font-size: 3vw;
        padding: 3%;
        font-weight: 700;
        text-align: center;
    }
    .widgetBox ul li {
        padding: 3% 4%;
    }
    @media (max-width: 768px) {
        .subInner {width: 100%; }
        .subInner.bannerInner {padding-top: 129px;}

        .pageLeft {width: 100%; padding-right: 0;}
        .pageRight {width: 100%; text-align: center; padding-top: 20px;}
    }
    @media (max-width:576px) {
        .page-content .con01 table tr,
        .page-content .con01 ul li { font-size: 15px;} 
        .page-content .con01 ul li dl { flex-direction: column; align-items: flex-start;}
    }
    @media (max-width:480px) {
        .page-content .con01 ul li { font-size:14px;}
    }
}