@charset "utf-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageHeader 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageHeader { background: url(../images/header_bg.jpg) no-repeat center top; background-size: auto 100%; font-size: 0; line-height: 0; padding: 25px calc( 50 / 1100 * 100% ) 0; }
.pageHeader .headerInner { position: relative; max-width: 1100px; margin-right: auto; margin-left: auto; }
.pageHeader .headerTitle { width: calc( 890 / 1100 * 100% ); background: url(../images/header_title1.gif) no-repeat left top; background-size: 100% auto; padding-top: calc( 55 / 1100 * 100% ); margin: 0 auto calc( 25 / 1100 * 100% ); }
.pageHeader .headerMain { overflow: hidden; width: calc( 850 / 1100 * 100% ); border-radius: 20px; margin: 0 auto calc( 43 / 1100 * 100% ); }
.pageHeader .headerBar { position: absolute; top: 0; left: 0; width: calc( 300 / 1100 * 100% ); background: url(../images/header_bar.png) no-repeat left top; background-size: cover; padding-top: calc( 126 / 1100 * 100% ); margin-top: calc( 373 / 1100 * 100% ); }
.pageHeader .headerBtn { position: relative; top: 0; width: calc( 155 / 1100 * 100% ); margin-left: calc( 100 / 1100 * 100% ); }
.pageHeader .headerBtn a { display: block; background: url(../images/header_btn.png) no-repeat left top; background-size: cover; padding-top: calc( 138 / 155 * 100% ); }
.pageHeader .headerLink { position: absolute; right: 0; bottom: 30px; }
.pageHeader .headerLink a { position: relative; display: inline-block; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 1.8rem; line-height: 3rem; color: #333333; font-weight: 700; padding: 5px 15px; }
.pageHeader .headerLink a::before,
.pageHeader .headerLink a::after { position: absolute; left: 0; display: block; width: 100%; height: 1px; background: linear-gradient(to right, #000000 5px, transparent 5px) repeat-x center bottom; background-size: 10px 1px; content: ""; }
.pageHeader .headerLink a::before { top: 0; }
.pageHeader .headerLink a::after { bottom: 0; }
.pageHeader .headerLink a span { position: relative; display: block; padding-right: 35px; }
.pageHeader .headerLink a span::after { position: absolute; top: 0; right: 0; bottom: 0; display: block; width: 21px; height: 23px; background-image: url(../images/link_arr.gif); background-size: 21px 23px; content: ""; margin-top: auto; margin-bottom: auto; }

@media screen and (min-width: 821px) {
	.pageHeader .headerBtn { transition: 0.2s ease; }
	.pageHeader .headerBtn:hover { top: 10px; }
	.pageHeader .headerLink a span::after { transition: 0.2s ease; }
	.pageHeader .headerLink a:hover span::after { right: -5px; }
}

@media screen and (max-width: 767px) {
	.pageHeader { background-position: center 50px; background-size: 1340px auto; padding: 30px calc( 15 / 320 * 100% ) 0; }
	.pageHeader .headerInner { max-width: 500px; }
	.pageHeader .headerTitle { width: 100%; background-image: url(../images/header_title2.gif); padding-top: calc( 38 / 500 * 100% ); margin-bottom: calc( 30 / 500 * 100% ); }
	.pageHeader .headerMain { width: 100%; border-radius: 10px; margin-bottom: calc( 140 / 500 * 100% ); }
	.pageHeader .headerBar { width: calc( 260 / 500 * 100% ); padding-top: calc( 109 / 500 * 100% ); margin-top: calc( 300 / 500 * 100% ); margin-left: calc( -10 / 500 * 100% ); }
	.pageHeader .headerBtn { width: 120px; margin: 0 auto 30px; }
	.pageHeader .headerLink { position: static; text-align: center; margin-bottom: 20px; }
	.pageHeader .headerLink a { font-size: 1.6rem; }
}

@media screen and (max-width: 552px) {
	.pageHeader { background-size: 240% auto; padding-top: calc( 30 / 552 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageWrap 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageWrap1 { padding: 60px calc( 100 / 1100 * 100% ) 0; }
.pageWrap2 { background: url(../images/contents_bg1.gif) no-repeat center top #f0f5f8; background-size: 3080px 300px; padding: 65px calc( 100 / 1100 * 100% ) 60px; }
.pageWrap3 { padding: 70px calc( 100 / 1100 * 100% ); }
.wrapInner { max-width: 900px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	.pageWrap1 { padding: 20px calc( 15 / 320 * 100% ); }
	.pageWrap2 { padding: 60px calc( 15 / 320 * 100% ) 40px; }
	.pageWrap3 { padding: 40px calc( 15 / 320 * 100% ); }
	.wrapInner { max-width: 500px; }
}


/* ――――――――――――――――――――――――――――――
［ wrap1 ］
―――――――――――――――――――――――――――――― */

/* wrap1Title
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.wrap1Title { border-bottom: solid 2px #000000; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 5.6rem; line-height: 7.8rem; font-weight: 400; text-align: center; padding-bottom: 25px; margin-bottom: 50px; }

@media screen and (max-width: 767px) {
	.wrap1Title { font-size: 2.6rem; line-height: 3.8rem; padding-bottom: 10px; margin-bottom: 30px; }
}


/* wrap1Showa
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.wrap1Showa { margin-bottom: 100px; }
.wrap1Showa .showaLaout1 { display: table; margin-bottom: 60px; }
.wrap1Showa .showaLaout1 .laoutTxt { display: table-cell; vertical-align: middle; padding-right: 70px; }
.wrap1Showa .showaLaout1 .laoutImg { display: table-cell; width: 345px; vertical-align: middle; }
.wrap1Showa .showaLaout2 { display: table; margin-bottom: 60px; }
.wrap1Showa .showaLaout2 .laoutTxt { display: table-cell; padding-right: 20px; }
.wrap1Showa .showaLaout2 .laoutImg { display: table-cell; width: 410px; }

@media screen and (max-width: 1000px) {
	.wrap1Showa .showaLaout2 { display: block; margin-bottom: 20px; }
	.wrap1Showa .showaLaout2 .laoutTxt { display: block; padding-right: 0; margin-bottom: 40px; }
	.wrap1Showa .showaLaout2 .laoutImg { display: block; max-width: 410px; width: 100%; margin-right: auto; margin-left: auto; }
}

@media screen and (max-width: 767px) {
	.wrap1Showa { margin-bottom: 60px; }
	.wrap1Showa .showaLaout1 { display: block; margin-bottom: 20px; }
	.wrap1Showa .showaLaout1 .laoutTxt { display: block; padding-right: 0; margin-bottom: 20px; }
	.wrap1Showa .showaLaout1 .laoutImg { display: block; width: 200px; margin-right: auto; margin-left: auto; }
	.wrap1Showa .showaLaout2 .laoutTxt { margin-bottom: 20px; }
}



/* wrap1Soka
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.wrap1Soka1 { overflow: hidden; margin-bottom: 100px; }
.wrap1Soka1 .soka1Img { float: right; width: 380px; padding: 8px 0 20px 60px; }
.wrap1Soka1 dl:not(:last-child) { margin-bottom: 36px; }
.wrap1Soka1 dl dt { color: #0065d6; font-weight: 700; }
.wrap1Soka2 { overflow: hidden; margin-bottom: 60px; }
.wrap1Soka2 .soka2Title { display: table; width: 100%; margin-bottom: 60px; }
.wrap1Soka2 .soka2Title .titleTxt { display: table-cell; font-size: 3.8rem; line-height: 8rem; vertical-align: bottom; padding-right: 40px; }
.wrap1Soka2 .soka2Title .titleImg { display: table-cell; width: 414px; }
.wrap1Soka2 .soka2Img { float: left; width: 380px; padding: 8px 60px 20px 0; }

@media screen and (max-width: 767px) {
	.wrap1Soka1 { margin-bottom: 30px; }
	.wrap1Soka1 .soka1Img { float: none; max-width: 320px; width: 100%; padding: 0; margin: 0 auto 20px; }
	.wrap1Soka1 dl:not(:last-child) { margin-bottom: 20px; }
	.wrap1Soka1 dl dt { color: #0065d6; }
	.wrap1Soka2 { display: flex; flex-wrap: wrap; margin-bottom: 30px; }
	.wrap1Soka2 .soka2Title { display: flex; flex-wrap: wrap;width: 100%; margin-bottom: 20px; }
	.wrap1Soka2 .soka2Title .titleTxt { order: 2; display: block; font-size: 2.6rem; line-height: 4rem; padding-right: 0; }
	.wrap1Soka2 .soka2Title .titleImg { order: 1; display: block; max-width: 414px; width: 100%; margin: 0 auto 20px; }
	.wrap1Soka2 .soka2Img { order: 3; float: none; max-width: 320px; width: 100%; padding: 0; margin: 30px auto 0; }
}



/* wrap1Hosei
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ */

.wrap1Hosei1 { overflow: hidden; margin-bottom: 60px; }
.wrap1Hosei1 .hosei1Img { float: right; width: 380px; padding: 8px 0 20px 60px; }
.wrap1Hosei1 dl:not(:last-child) { margin-bottom: 36px; }
.wrap1Hosei1 dl dt { color: #0678f1; font-weight: 700; }

@media screen and (max-width: 767px) {
	.wrap1Hosei1 { margin-bottom: 30px; }
	.wrap1Hosei1 .hosei1Img { float: none; max-width: 320px; width: 100%; padding: 0; margin: 0 auto 20px; }
	.wrap1Hosei1 dl:not(:last-child) { margin-bottom: 20px; }
	.wrap1Hosei1 dl dt { color: #0065d6; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 unInfo 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.infoTitle { width: 170px; height: 152px; background: url(../images/info_ttile.png) no-repeat left top; background-size: cover; font-size: 0; line-height: 0; margin: 0 auto 20px; }

.infoLead { position: relative; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 3rem; line-height: 5.4rem; color: #0039bf; text-align: center; padding: 40px; }
.infoLead::before,
.infoLead::after { position: absolute; width: 50px; height: 50px; display: block; background: url(../images/info_lead.svg) no-repeat left top; background-size: cover; content: ""; }
.infoLead::before { top: 0; left: 0; }
.infoLead::after { right: 0; bottom: 0; transform: rotate(180deg); }

.infoLink { max-width: 500px; margin: 0 auto 50px; }
.infoLink a { position: relative; overflow: hidden; display: block; background-color: #ffffff; border: solid 1px #0039bf; border-radius: 30px; font-size: 2rem; line-height: 3rem; color: #0039bf; text-align: center; padding: 15px; }
.infoLink a::before,
.infoLink a::after { position: absolute; display: block; border: solid #0039bf; content: ""; }
.infoLink a::before { top: 24px; right: 27px; width: 11px; height: 9px; border-width: 2px 1px 1px; }
.infoLink a::after { top: 29px; right: 33px; width: 8px; height: 7px; border-width: 0 0 1px 1px; }

.infoData .dataName { 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: 25px; }

.infoData .dataAdress { font-size: 1.6rem; line-height: 2.8rem; }
.infoData div.dataAdress { text-align: center; }
.infoData table.dataAdress { margin-right: auto; margin-left: auto; }
.infoData table.dataAdress tr th { font-weight: 500; text-align: left; padding-right: 20px; }

@media screen and (min-width: 821px) {
	.infoLink a,
	.infoLink a::before,
	.infoLink a::after { transition: 0.2s ease; }
	.infoLink a:hover { background-color: #0039bf; color: #ffffff; }
	.infoLink a:hover::before,
	.infoLink a:hover::after { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.infoLead { font-size: 2rem; line-height: 3rem; padding: 20px; }
	.infoLead::before,
	.infoLead::after { width: 25px; height: 25px; }
	
	.infoLink { margin-bottom: 30px; }
	.infoLink a { font-size: 1.6rem; padding: 10px; }
	.infoLink a::before { top: 19px; right: 20px; }
	.infoLink a::after { top: 24px; right: 26px; }
	
	.infoData .dataName { font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 2.4rem; line-height: 3.4rem; margin-bottom: 5px; }
	.infoData .dataFaculty { font-size: 1.4rem; line-height: 2.4rem; margin-bottom: 20px; }
	.infoData .dataAdress { font-size: 1.4rem; line-height: 2.4rem; }
	.infoData table.dataAdress { tbody,tr,th,td { display: block; } }
	.infoData table.dataAdress tr th { padding-right: 0; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 footerLink 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.footerLink { max-width: 660px; text-align: center; margin-right: auto; margin-left: auto; }
.footerLink a { position: relative; display: block; padding: 20px; }
.footerLink a::before,
.footerLink a::after { position: absolute; left: 0; display: block; width: 100%; height: 1px; background: linear-gradient(to right, #000000 5px, transparent 5px) repeat-x center bottom; background-size: 10px 1px; content: ""; }
.footerLink a::before { top: 0; }
.footerLink a::after { bottom: 0; }
.footerLink a span { display: inline-block; background: url(../images/link_arr.gif) no-repeat right center; background-size: 21px 23px; font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN", serif; font-size: 2.4rem; line-height: 4rem; color: #333333; font-weight: 700; padding-right: 35px; }

@media screen and (min-width: 821px) {
	.footerLink a { transition: 0.2s ease; }
	.footerLink a:hover { opacity: 0.5; }
}

@media screen and (max-width: 767px) {
	.footerLink a { padding: 15px; }
	.footerLink a span { font-size: 1.8rem; line-height: 3rem; }
}
