@charset "utf-8";
/* Author: Hosaka */
/* ---------------------------------------------------
	sec01
------------------------------------------------------ */
.sec01 {width: 100%; max-width: 1200px; margin: 100px auto;}
.sec01 h2 {text-align: center; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 40px; font-weight: bold; margin-bottom: 50px; letter-spacing: 0.05em; line-height: 1.4; color: #03526F;}
.sec01 p {margin-bottom: 20px; font-size: 20px; line-height: 1.8; text-align: center;}
.sec01 .linkbtn {text-align: center; margin-top: 40px; font-size: 20px;}
.sec01 .linkbtn a {color: #03526F; display: inline-block; margin: 0 auto; min-width: 300px; text-align: center; border: 1px solid #03526F; border-radius: 5px; padding: 20px 0; line-height: 1;}
.sec01 .linkbtn a:after {content: ""; display: inline-block; width: 7px; height: 10px; background: url("../images/common/ico-arrow-cr@2x.png") no-repeat center right; background-size: cover; vertical-align: middle; margin-left: 20px;}


@media screen and (max-width: 767px) {
    .sec01 {width: 100%; max-width: 100%; margin: 50px auto;}
    .sec01 h2 {font-size: 20px; margin-bottom: 25px;}
    .sec01 p {font-size: 16px; text-align: left; padding: 0 15px;}
    .sec01 .linkbtn {padding: 0 15px;}
    .sec01 .linkbtn a {width: 100%;}
}


/* ---------------------------------------------------
	sec02
------------------------------------------------------ */
.sec02 {width: 100%; margin: 100px auto; padding: 0 3.125%; box-sizing: border-box;}
.sec02 .inner {margin: 0 auto; display: flex; justify-content: center; align-items: center;}
.sec02 .bg1 {width: 100%; height: 620px; background: url("../img/top/bg-sec02-01@2x.jpg") no-repeat top center; background-size: cover; padding: 80px 0; box-sizing: border-box;}
.sec02 .bg2 {width: 100%; height: 620px; background: url("../img/top/bg-sec02-02@2x.jpg") no-repeat top center; background-size: cover; padding: 80px 0; box-sizing: border-box;}
.sec02 .bg3 {width: 100%; height: 620px; background: url("../img/top/bg-sec02-03@2x.jpg") no-repeat top center; background-size: cover; padding: 80px 0; box-sizing: border-box;}
.sec02 .bg4 {width: 100%; height: 620px; background: url("../img/top/bg-sec02-04@2x.jpg") no-repeat top center; background-size: cover; padding: 80px 0; box-sizing: border-box;}
.sec02 .tit {width: 40%; max-width: 720px; margin-top: 150px;}
.sec02 .tit > div {width: 100%; text-align: left; position: relative;}
.sec02 .tit > div:after {content: ""; display: block; width: 100%; border-bottom: 4px dotted #FFF; position: absolute; bottom: 10px; left: 0;}
.sec02 .bg2 .tit, .sec02 .bg4 .tit {order: 10;}
.sec02 .bg2 .tit > div, .sec02 .bg4 .tit > div {text-align: right;}
.sec02 .box {width: 38.889%; max-width: 700px; padding: 50px; border-radius: 10px; background: #FFF; box-sizing: border-box;}
.sec02 .box h3 {font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 30px; font-weight: bold; line-height: 1.6; letter-spacing: 0.05em; margin: 0 0 20px;}
.sec02 .box p {margin:0 0 20px;}
.sec02 .box p.tred {color: #8F0000; font-size: 22px; margin-bottom: 25px; font-weight: bold;}
.sec02 .box .linkbtn a {color: #03526F; display: inline-block; margin: 0 auto; min-width: 300px; text-align: center; border: 1px solid #03526F; border-radius: 5px; padding: 15px 0; line-height: 1; font-size: 20px;}
.sec02 .box .linkbtn a:after {content: ""; display: inline-block; width: 7px; height: 10px; background: url("../images/common/ico-arrow-cr@2x.png") no-repeat center right; background-size: cover; vertical-align: middle; margin-left: 20px;}

@media screen and (max-width: 767px) {
    .sec02 {width: 100%; margin: 50px auto; padding: 0;}
    .sec02 .inner {margin: 0 auto; display: block;}
    .sec02 .bg1 {width: 100%; height: auto; background: none; padding: 40px 15px;}
    .sec02 .bg2 {width: 100%; height: auto; background: none; padding: 40px 15px;}
    .sec02 .bg3 {width: 100%; height: auto; background: none; padding: 40px 15px;}
    .sec02 .bg4 {width: 100%; height: auto; background: none; padding: 40px 15px;}
    .sec02 .tit {width: 100%; max-width: 100%; margin-top: 0;}
    .sec02 .tit > div {width: 100%;}
    .sec02 .tit > div:after {content: ""; display: none;}
    .sec02 .bg2 .tit, .sec02 .bg4 .tit {order: 0;}
    .sec02 .bg2 .tit > div, .sec02 .bg4 .tit > div {text-align: left;}
    .sec02 .box {width: 100%; max-width: 100%; padding: 20px 0 0;}
    .sec02 .box h3 {font-size: 20px; font-weight: bold; line-height: 1.6; letter-spacing: 0.05em; margin: 0 0 20px;}
    .sec02 .box p {margin:0 0 20px; font-size: 16px; line-height: 1.8;}
    .sec02 .box p.tred {color: #8F0000; font-size: 16px; margin-bottom: 20px;}
    .sec02 .box .linkbtn a {display: inline-block; margin: 0 auto; min-width: auto; width: 100%;}
    .sec02 .box .linkbtn a:after {}
}


/* ---------------------------------------------------
	sec03
------------------------------------------------------ */
.sec03 {width: 100%; margin: 100px auto; box-sizing: border-box;}
.sec03-btn {width: 57.2917%; max-width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; text-decoration: none; border: 1px solid #000;}
.sec03-btn .txt {width: 31.818%; max-width: 350px; white-space: nowrap; text-align: center; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 30px; font-weight: bold;}
.sec03-btn .txt img {vertical-align: middle;}
.sec03-btn .img {width: 68.181%; max-width: 750px;}

@media screen and (max-width: 767px) {
    .sec03 {width: 100%; margin: 50px auto; padding: 0 15px;}
    .sec03-btn {width: 100%; max-width: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; text-decoration: none; border: 1px solid #000;}
    .sec03-btn .txt {width: 50.145%; max-width: 173px; white-space: nowrap; text-align: center; font-size: 20px;}
    .sec03-btn .img {width: 49.855%; max-width: 172px;}
}



/* ---------------------------------------------------
    web4_summary_news_new（web4用お知らせ新着）
------------------------------------------------------ */

.mainimg .top-news {position: absolute; left: 1rem; bottom: calc(100vw / (1920 / 280)); width: 35.5%; min-width: 450px; display: flex; z-index: 9; background-color: #FFF; }

.mainimg .top-news .heading { margin: 0; font-size: 1.2rem; letter-spacing: 0.05em; color: #fff; text-align: center; width: 6rem; height: 6rem; background-color: #03526f; display: flex; flex-direction: column; align-items: center; justify-content: center;font-weight: 500;line-height: 1.2;}

.mainimg .top-news .post { width: calc(100% - 6rem); box-sizing: border-box; height: 100%; padding: 0.8rem 1rem; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; margin: auto 0; }
.mainimg .top-news .post a { width: 100%; box-sizing: border-box; }
.mainimg .top-news .post .date { color: #03526f; font-size: 1.1rem;line-height: 1.4;font-weight: 400;}
.mainimg .top-news .post__title { width: 100%;font-size: 1.2rem;line-height: 1.44; box-sizing: border-box; font-weight: 400; margin-top: 0.2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation:landscape) {
    .mainimg .top-news { display: flex; width: 100%; z-index: 9; position: relative; background-color: #FFF;left: 0;bottom: 0px; min-width: 100%; }
    .mainimg .top-news .heading { font-size: 15px; letter-spacing: 0.05em; color: #fff; text-align: center; width: 5rem; height: 5rem; line-height: 1.4; display: flex; flex-direction: column; align-items: center; justify-content: center; }
    .mainimg .top-news .post { width: calc(100% - 5rem); box-sizing: border-box; height: 100%; padding: 0 1rem; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 5rem; }
    .mainimg .top-news .post a { width: 100%; box-sizing: border-box; line-height: 1.2; }
    .mainimg .top-news .post .date { font-size: 88.88%; }
    .mainimg .top-news .post__title { width: 100%; box-sizing: border-box; font-weight: 500; margin-top: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px;}
}





/* ---------------------------------------------------
    top_summary_news_new(top_summary)
------------------------------------------------------ */

.top_news_summary {margin-top: 100px;}

.top_news_summary h2.top_news_title {font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-weight: 400; font-style: normal; font-size: 46px; line-height: 1.2; color: #03526F; border-left: none; letter-spacing: 0.05em; text-align: center;padding-bottom: 10px;border-bottom: 1px solid #999;margin: 0.83em auto;width: 97%;max-width: 1200px;}
.top_news_summary .summary_content{margin: 0 auto 100px;width: 97%;max-width: 1200px;}
.top_news_summary .post { box-sizing: border-box; height: 100%; padding: 1.5rem 2.5rem; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; border-bottom: 1px solid #CCC;}
.top_news_summary .post a { width: 100%; box-sizing: border-box; display: flex; align-items: center;}
.top_news_summary .post .date { color: #03526f; font-size: 1.2rem;line-height: 1.4;font-weight: 400;}
.top_news_summary .post__title { width: 100%;font-size: 1.2rem;line-height: 1.44; box-sizing: border-box; font-weight: 400; margin-left: 1.2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.top_news_summary .btnlink {margin-top: 60px;}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation:landscape) {
    .top_news_summary { display: flex; width: 100%; z-index: 9; position: relative; background-color: #FFF;left: 0;bottom: 0px; flex-wrap: wrap; }

    .top_news_summary h2.top_news_title {font-size: 28px;margin: 20px auto; width: calc(100% - 20px);}
    .top_news_summary .summary_content{max-width: calc(100% - 20px);}

    .top_news_summary .heading { font-size: 15px; letter-spacing: 0.05em; color: #fff; text-align: center; width: 5rem; height: 5rem; line-height: 1.4; display: flex; flex-direction: column; align-items: center; justify-content: center; }
    .top_news_summary .post { width: 100%; box-sizing: border-box; height: 100%; padding: 0 0.5rem; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 4.5rem; }
    .top_news_summary .post a { width: 100%; box-sizing: border-box; line-height: 1.2; }
    .top_news_summary .post .date { font-size: 88.88%; }
    .top_news_summary .post__title { width: 100%; box-sizing: border-box; font-weight: 500; margin-top: 0rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; margin-left: 0.5rem;}
    .top_news_summary .btnlink {margin-top: 40px;}
}

