@charset "utf-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageHeader 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageHeader { background: url(../images/header_bg1.png) no-repeat center top; background-size: 1400px auto; font-size: 0; line-height: 0; padding: 0 calc( 50 / 1100 * 100% ) 190px; margin-top: 50px; }
.pageHeader .headerInner { position: relative; max-width: 1100px; margin-right: auto; margin-left: auto; }
.pageHeader .headerMain { background-image: url(../images/header_main1.jpg); background-size: cover; padding-top: calc( 595 / 1100 * 100% ); }
.pageHeader .headerBtn { position: absolute; bottom: 0; width: calc( 230 / 1100 * 100% ); margin-left: calc( 33 / 1100 * 100% ); }
.pageHeader .headerBtn a { display: block; background: url(../images/header_btn.png) no-repeat left top; background-size: cover; padding-top: calc( 124 / 230 * 100% ); }
.pageHeader .headerLink { position: absolute; right: 0; bottom: -90px; }
.pageHeader .headerLink a { position: relative; display: inline-block; border: solid 2px #24abda; border-radius: 27px; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 2.2rem; line-height: 3rem; color: #24abda; font-weight: 700; padding: 10px 23px; }
.pageHeader .headerLink a span { position: relative; display: block; padding-left: 36px; }
.pageHeader .headerLink a span::before,
.pageHeader .headerLink a span::after { position: absolute; top: 0; bottom: 0; display: block; content: ""; margin-top: auto; margin-bottom: auto; }
.pageHeader .headerLink a span::before { left: 0; display: block; width: 20px; height: 2px; background-color: #24abda; }
.pageHeader .headerLink a span::after { left: 6px; display: block; width: 14px; height: 14px; border: solid #24abda; border-width: 0 2px 2px 0; transform: rotate(-45deg); }

@media screen and (max-width: 1210px) {
	.pageHeader { background-size: 115% auto; }
}

@media screen and (min-width: 821px) {
	.pageHeader .headerLink a,
	.pageHeader .headerLink a span::before,
	.pageHeader .headerLink a span::after { transition: 0.2s ease; }
	.pageHeader .headerLink a:hover { background-color: #24abda; color: #ffffff; }
	.pageHeader .headerLink a:hover span::before { background-color: #ffffff; }
	.pageHeader .headerLink a:hover span::after { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.pageHeader { background-image: none; padding: 0 0 60px; margin-top: 20px; }
	.pageHeader .headerInner { max-width: 500px; }
	.pageHeader .headerMain { background-image: url(../images/header_main2.jpg); padding-top: calc( 475 / 500 * 100% ); }
	.pageHeader .headerBtn { position: static; width: 228px; margin: 0 auto 30px; }
	.pageHeader .headerBtn a { width: 200px; padding-top: 108px; }
	.pageHeader .headerLink { position: static; text-align: center; padding: 0 calc( 15 / 320 * 100% ); }
	.pageHeader .headerLink a { font-size: 1.5rem; padding: 8px 17px; }
	.pageHeader .headerLink a span { padding-left: 24px; }
	.pageHeader .headerLink a span::before { width: 14px; }
	.pageHeader .headerLink a span::after { left: 4px; width: 10px; height: 10px; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageWrap1 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageWrap1 { padding-right: calc( 50 / 1100 * 100% ); padding-left: calc( 50 / 1100 * 100% ); }
.pageWrap1 .wrapInner { max-width: 900px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	.pageWrap1 { padding-right: calc( 15 / 320 * 100% ); padding-left: calc( 15 / 320 * 100% ); }
	.pageWrap1 .wrapInner { max-width: 500px; }
}



/* ――――――――――――――――――――――――――――――
［ wrap1Lead ］
―――――――――――――――――――――――――――――― */

.wrap1Lead { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 1.8rem; line-height: 3.6rem; font-weight: 700; margin-bottom: 50px; }

@media screen and (max-width: 767px) {
	.wrap1Lead { font-size: 1.6rem; line-height: 2.6rem; margin-bottom: 30px; }
}



/* ――――――――――――――――――――――――――――――
［ showa Set ］
―――――――――――――――――――――――――――――― */

/* showaTitle1
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaTitle1 { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 6.5rem; line-height: 7.3rem; color: #ffffff; margin-bottom: 40px; }
.showaTitle1 span { display: inline-block; background-color: #899597; padding: 2px 15px 0; }
.showaTitle1 span:not(:last-child) { margin-bottom: 12px; }

@media screen and (max-width: 990px) {
	.showaTitle1 { font-size: 6.5vw; line-height: 7.3vw; }
}

@media screen and (max-width: 767px) {
	.showaTitle1 { font-size: 2.5rem; line-height: 4rem; margin-bottom: 20px; }
	.showaTitle1 span { padding: 0 10px; }
	.showaTitle1 span:not(:last-child) { margin-bottom: 8px; }
}


/* showaTitle2
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaTitle2 { position: relative; padding-bottom: 30px; margin-bottom: 40px; }
.showaTitle2 .titleTxt { position: absolute; bottom: 0; left: 0; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 3.6rem; line-height: 6rem; color: #ffffff; }
.showaTitle2 .titleTxt span { display: inline-block; background-color: #899597; padding: 2px 15px 0; }
.showaTitle2 .titleTxt span:not(:last-child) { margin-bottom: 4px; }
.showaTitle2 .titleImg { width: 520px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	.showaTitle2 .titleTxt { font-size: 2.2rem; line-height: 3.6rem; }
	.showaTitle2 .titleImg { width: 300px; }
}


/* showaQue
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaQue { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; color: #0089e0; font-weight: 700; }



/* showaLaout1
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaLaout1 { overflow: hidden; }
.showaLaout1 .laoutImg { float: left; width: 240px; padding-top: 8px; }
.showaLaout1 .laoutTxt { float: right; width: calc( 100% - 285px ); }

@media screen and (max-width: 767px) {
	.showaLaout1 .laoutImg { float: none; max-width: 240px; width: 100%; padding-top: 0; margin: 0 auto 30px; }
	.showaLaout1 .laoutTxt { float: none; width: 100%; }
}


/* showaLaout2
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaLaout2 { overflow: hidden; }
.showaLaout2 .laoutTxt { float: left; width: calc( 100% - 285px ); }
.showaLaout2 .laoutImg { float: right; width: 240px; padding-top: 8px; }


@media screen and (max-width: 767px) {
	.showaLaout2 .laoutTxt { float: none; width: 100%; margin-bottom: 30px; }
	.showaLaout2 .laoutImg { float: none; max-width: 240px; width: 100%; padding-top: 0; margin-right: auto; margin-left: auto; }
}



/* ――――――――――――――――――――――――――――――
［ soka Set ］
―――――――――――――――――――――――――――――― */

/* sokaTitle1
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.sokaTitle1 { position: relative; padding-top: 115px; margin-bottom: 40px; }
.sokaTitle1 .titleTxt { position: absolute; top: 0; left: 0; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 6.5rem; line-height: 7.3rem; color: #ffffff; }
.sokaTitle1 .titleTxt span { display: inline-block; background-color: #899597; padding: 2px 15px 0; }
.sokaTitle1 .titleTxt span:not(:last-child) { margin-bottom: 4px; }
.sokaTitle1 .titleImg { width: 610px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	.sokaTitle1 { padding-top: 60px; }
	.sokaTitle1 .titleTxt { font-size: 2.2rem; line-height: 3.6rem; }
	.sokaTitle1 .titleImg { width: 300px; }
}



/* sokaTitle2
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.sokaTitle2 { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 3.6rem; line-height: 6rem; color: #ffffff; margin-bottom: 40px; }
.sokaTitle2 span { display: inline-block; background-color: #899597; padding: 2px 15px 0; }
.sokaTitle2 span:not(:last-child) { margin-bottom: 4px; }

@media screen and (max-width: 767px) {
	.sokaTitle2 { font-size: 2.2rem; line-height: 3.6rem; margin-bottom: 20px; }
}


/* sokaLaout1
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.sokaLaout1 { overflow: hidden; }
.sokaLaout1 .laoutTxt { float: left; width: calc( 100% - 425px ); }
.sokaLaout1 .laoutImg { float: right; width: 360px; padding-top: 8px; }

@media screen and (max-width: 767px) {
	.sokaLaout1 .laoutTxt { float: none; width: 100%; }
	.sokaLaout1 .laoutImg { float: none; max-width: 300px; width: 100%; padding-top: 30px; margin-right: auto; margin-left: auto; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageWrap2 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageWrap2 { position: relative; padding: 0 calc( 50 / 1100 * 100% ) 60px; margin-top: 300px; }
.pageWrap2.wrapShowa { background-color: #0089e0; }
.pageWrap2.wrapSoka { background-color: #3640b5; }
.pageWrap2::before { position: absolute; top: 0; left: 0; display: block; width: 100%; background-size: 100% 100%; content: ""; padding-top: 260px; margin-top: -260px; }
.pageWrap2.wrapShowa::before { background-image: url(../images/wrap_bg1.svg); }
.pageWrap2.wrapSoka::before { background-image: url(../images/wrap_bg2.svg); }
.pageWrap2 .wrapBg { max-width: 1100px; background-color: #ffffff; border-radius: 25px; padding: 40px 50px 50px; margin-right: auto; margin-left: auto; }
.pageWrap2 .wrapInner { max-width: 900px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 1400px) {
	.pageWrap2 { margin-top: calc( 300 / 1400 * 100% ); }
	.pageWrap2::before { padding-top: calc( 260 / 1400 * 100% ); margin-top: calc( -260 / 1400 * 100% ); }
}

@media screen and (max-width: 767px) {
	.pageWrap2 { padding: 0 calc( 15 / 320 * 100% ) 20px; }
	.pageWrap2 .wrapBg { max-width: 500px; border-radius: 15px; padding: 20px 15px; }
}



/* ――――――――――――――――――――――――――――――
［ showa Set ］
―――――――――――――――――――――――――――――― */

/* showaTable
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.showaTable { max-width: 870px; margin: 0 auto 40px; }
.showaTable span { display: block; background-image: url(../images/showa_table1.gif); background-size: cover; font-size: 0; line-height: 0; padding-top: calc( 365 / 870 * 100% ); }

@media screen and (max-width: 767px) {
	.showaTable { max-width: 440px; margin-bottom: 20px; }
	.showaTable span { background-image: url(../images/showa_table2.gif); padding-top: calc( 590 / 440 * 100% ); }
}



/* ――――――――――――――――――――――――――――――
［ soka Set ］
―――――――――――――――――――――――――――――― */

/* sokaTable
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.sokaTable { margin-bottom: 40px; }
.sokaTable span { display: block; background-image: url(../images/soka_table1.gif); background-size: cover; font-size: 0; line-height: 0; padding-top: calc( 920 / 900 * 100% ); }

@media screen and (max-width: 767px) {
	.sokaTable { max-width: 440px; margin: 0 auto 20px; }
	.sokaTable span { background-image: url(../images/soka_table2.gif); padding-top: calc( 880 / 440 * 100% ); }
}



/* ――――――――――――――――――――――――――――――
［ infoLead ］
―――――――――――――――――――――――――――――― */

.infoLead { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 3.2rem; line-height: 5.6rem; text-align: center; margin-bottom: 30px; }

@media screen and (max-width: 767px) {
	.infoLead { font-size: 2rem; line-height: 3.6rem; text-align: left; margin-bottom: 20px; }
}



/* ――――――――――――――――――――――――――――――
［ infoLink ］
―――――――――――――――――――――――――――――― */

.infoLink { margin-bottom: 50px; }
.infoLink.linkType1 { max-width: 500px; margin-right: auto; margin-left: auto; }
.infoLink.linkType2 { text-align: center; }
.infoLink a { position: relative; overflow: hidden; background-color: #ffffff; border: solid 1px #000000; border-radius: 30px; line-height: 3rem; color: #000000; }
.infoLink.linkType1 a { display: block; text-align: center; font-size: 2rem; padding: 15px; }
.infoLink.linkType2 a { display: inline-block; font-size: 1.8rem; text-align: left; padding: 15px 56px 15px 30px; }
.infoLink a::before,
.infoLink a::after { position: absolute; display: block; border: solid #000000; content: ""; margin-top: auto; margin-bottom: auto; }
.infoLink a::before { top: -4px; bottom: 0; right: 27px; width: 11px; height: 9px; border-width: 2px 1px 1px; }
.infoLink a::after { top: 0; bottom: -4px; right: 33px; width: 8px; height: 7px; border-width: 0 0 1px 1px; }

@media screen and (min-width: 821px) {
	.infoLink a,
	.infoLink a::before,
	.infoLink a::after { transition: 0.2s ease; }
	.infoLink a:hover { background-color: #000000; color: #ffffff; }
	.infoLink a:hover::before,
	.infoLink a:hover::after { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.infoLink { margin-bottom: 30px; }
	.infoLink.linkType1 { max-width: 350px; margin-right: auto; margin-left: auto; }
	.infoLink.linkType1 a { font-size: 1.6rem; padding: 10px; }
	.infoLink.linkType2 a { font-size: 1.5rem; line-height: 2.2rem; padding: 14px 50px 14px 20px; }
	.infoLink a::before { right: 20px; }
	.infoLink a::after { right: 26px; }
}



/* ――――――――――――――――――――――――――――――
［ infoData ］
―――――――――――――――――――――――――――――― */

.infoData .dataName { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 3.4rem; line-height: 4.4rem; font-weight: 700; text-align: center; margin-bottom: 15px; }
.infoData .dataFaculty { font-size: 1.6rem; line-height: 2.8rem; text-align: center; margin-bottom: 10px; }
.infoData .dataFaculty sup { font-size: 1.4rem; line-height: 1.4rem; }
.infoData .dataAdress { font-size: 1.6rem; line-height: 2.8rem; }
.infoData .dataAdress { text-align: center; }

@media screen and (max-width: 767px) {
	.infoData .dataName { font-size: 2.4rem; line-height: 3.4rem; margin-bottom: 5px; }
	.infoData .dataFaculty { font-size: 1.4rem; line-height: 2.4rem; }
	.infoData .dataAdress { font-size: 1.4rem; line-height: 2.4rem; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageWrap3 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageWrap3 { padding: 70px calc( 100 / 1100 * 100% ); }
.pageWrap3 .wrapInner { max-width: 900px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	.pageWrap3 { padding: 40px calc( 15 / 320 * 100% ); }
	.wrapInner { max-width: 500px; }
}



/* ――――――――――――――――――――――――――――――
［ footerLink ］
―――――――――――――――――――――――――――――― */

.footerLink { max-width: 680px; margin-right: auto; margin-left: auto; }
.footerLink a { display: block; background-size: cover; border: solid #bfbfbf; border-width: 1px 0; font-size: 0; line-height: 0; padding-top: calc( 78 / 680 * 100% ); }
.footerLink.linkType1 a { background-image: url(../images/footer_link1_1.gif); }
.footerLink.linkType2 a { background-image: url(../images/footer_link2_1.gif); }

@media screen and (max-width: 767px) {
	.footerLink { max-width: 450px; }
	.footerLink a { padding-top: calc( 128 / 450 * 100% ); }
	.footerLink.linkType1 a { background-image: url(../images/footer_link1_2.gif); }
	.footerLink.linkType2 a { background-image: url(../images/footer_link2_2.gif); }
}
