@charset "UTF-8";
@font-face {
	font-family: 'chart';
	src:
		url('../fonts/chart.ttf?3rt2mn') format('truetype'),
		url('../fonts/chart.woff?3rt2mn') format('woff'),
		url('../fonts/chart.svg?3rt2mn#chart') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'chart' !important;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-ico_dep_female:before {
	content: "\66";
}
.icon-ico_dep_male:before {
	content: "\6d";
}
.icon-ico_dep_teacher:before {
	content: "\74";
}

.l-main--dep { margin-bottom: 10px; }
.breadcrumb { margin-bottom: 0; }
.l-header__dep { pointer-events: none; position: fixed; right: 0; top: 0; display: flex; justify-content: space-between; align-items: center; height: 60px; z-index: 6000; transition: 0.3s; }


.page-head--dep { height: 220px; }
.page-head--science { background-image: url("/department/img/science/ph_mv_science_sp.jpg"); }
.page-head--engineering { background-image: url("/department/img/engineering/ph_mv_sp.jpg"); }
.page-head--biological { background-image: url("/department/img/biological/ph_mv_sp.jpg"); }
.page-head--architecture { background-image: url("/department/img/architecture/ph_mv_sp.jpg"); }
.page-head--policy { background-image: url("/department/img/policy/ph_mv_sp.jpg"); }

.header-logo__title { text-align: left; }
.header-logo--dep { position: absolute; top: 20px; left: 20px; }

@media screen and (max-width: 1090px) {
	
	.l-body--dep { background: #fff; }
	.menu-btn--dep { width: 60px; }
	.menu-btn--dep span { width: 20px; }
	.menu-btn--dep span:nth-child(1) { margin-top: -6px; }
	.menu-btn--dep span:nth-child(3) { margin-top: 6px; }
	
}

@media screen and (min-width: 1091px) {
	
	.l-main--dep { margin-bottom: 100px; }
	.l-pc-white--pb-sm { padding-bottom: 100px; }
	.page-head--dep { height: 600px; padding-top: 0; padding-bottom: 125px; }
	.page-head--science { background-image: url("/department/img/science/ph_mv_science_pc.jpg"); }
	.page-head--engineering { background-image: url("/department/img/engineering/ph_mv_pc.jpg"); }
	.page-head--biological { background-image: url("/department/img/biological/ph_mv_pc.jpg"); }
	.page-head--architecture { background-image: url("/department/img/architecture/ph_mv_pc.jpg"); }
	.page-head--policy { background-image: url("/department/img/policy/ph_mv_pc.jpg"); }
	.header-logo--dep { padding-left: 25px; }
	
}
@media screen and (min-width: 1280px) {
	.header-logo--dep { top: 47px; padding-left: 32px; }
}

@media screen and (max-width: 1090px) {
	
	.l-sp-blue:before { display: none; }
	
}

.w100-wrap { position: relative; left: 50%; transform: translateX(-50%); width: 100vw; background-color: #fff; }
.w100-wrap__inside { width: 89.3%; margin-left: auto; margin-right: auto; }
.ttl-dep-common-wrap { text-align: center; margin-bottom: 20px; }
.ttl-dep-common { position: relative; padding-top: 30px; }
.txt_front { position: relative; font-size: 1.8rem; font-weight: 500; line-height: 1; letter-spacing: 0.2em; z-index: 5; }
.txt_behind { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; font: 100 italic 5.0rem "Roboto", sans-serif; color: #f0f0f0; line-height: 1; letter-spacing: 0.05em; z-index: 0; }
.ttl-dep-common__notice { margin-top: 20px; font-size: 1.4rem; text-align: center; }


@media screen and (min-width: 768px) {
	
	.ttl-dep-common-wrap { position: relative; text-align: center; margin-bottom: 50px; }
	.ttl-dep-common { padding-top: 70px; }
	.txt_front { font-size: 2.4rem; letter-spacing: 0.15em; }
	.txt_behind { font-size: 9.3rem; }
	.ttl-dep-common__notice { position: absolute; right: 0; bottom: 0; margin-top: 0; text-align: right; }
	
}

@media screen and (min-width: 1091px) {
	
	.w100-wrap { max-width: 1070px; }
	.w100-wrap__inside { width: 100%; }
	
}

/*------------------
		Chart area
------------------*/
.graph-wrap { border: 1px solid; }
.graph { padding: 20px; }
.graph--student,
.graph--teacher { border-bottom: 1px solid; }
.graph__ttl { margin-bottom: 20px; padding: 10px 0; border: 1px solid; font-size: 1.8rem; text-align: center; line-height: 1; letter-spacing: 1em; text-indent: 1em; }

.graph-chart { position: relative; padding-top: 92px; }
.graph-chart__student { position: absolute; top: 0; display: flex; align-items: center; }
.graph-chart__student:before { position: absolute; bottom: -50px; display: block; width: 1px; height: 40px; content: ""; }

.graph-chart__student--male { right: 50%; transform: translateX(-5px); justify-content: flex-end; text-align: right; }
.graph-chart__student--male:before { right: 20px; }
.graph-chart__student--female { left: 50%; transform: translateX(5px); justify-content: flex-start; flex-direction: row-reverse; text-align: left; }
.graph-chart__student--female3keta { transform: translateX(145px); }
.graph-chart__student--female:before { left: 20px; }

.student-txt { flex: 1; }
.student-txt span, .student-txt strong { display: block; line-height: 1; }
.student-txt span { margin-bottom: 10px; font-size: 1.4rem; }



.rbtitl-number { font: 100 italic 4.8rem "Roboto", sans-serif; line-height: 1; }
.rbtitl-number:after { font-style: normal; content: "人"; }
.rbtitl-number--md { font-size: 4.8rem; }
.rbtitl-number--md:after { font-size: 1.4rem; }
.rbtitl-number--lg { font-size: 8.0rem; }
.rbtitl-number--lg:after { font-size: 50%; }

.rbtitl-number--xs { font-size: 3.4rem; }
.rbtitl-number--lgxs { font-size: 6.0rem; }




.student-img { position: relative; width: 40px; height: 70px; }
.student-img:before { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); font-family: 'chart'; font-size: 7rem; font-weight: normal; text-align: center; }

.graph-chart__student--male .student-txt { margin-right: 10px; }
.graph-chart__student--female .student-txt { margin-left: 10px; }
.graph-chart__student--male .student-img:before { content: "m"; }
.graph-chart__student--female .student-img:before { content: "f"; }

.graph-chart__circle { position: relative; max-width: 295px; height: 295px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: auto; margin-right: auto; z-index: 0; }
.graph-chart__circle > p { position: relative; z-index: 5; }
.graph-chart__circle > p strong,
.graph-chart__circle > p span { display: block; text-align: center; line-height: 1; }
.graph-chart__circle > p span { margin-top: 10px; color: #000; }
.circle-chart { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); width: 295px; height: 295px; }

.teacher { display: flex; justify-content: center; align-items: center; }
.teacher__img { margin-right: 10px; font-family: 'chart'; font-size: 8.8rem; }

.license:not(:last-child) { margin-bottom: 20px; }
.license__ttl { margin-bottom: 10px; font-size: 1.4rem; font-weight: 500; }
.license__ttl .spacer { margin-right: 50px; }
@media screen and (max-width: 375px) {
	.license__ttl .spacer { margin-right: 33px; }
}

.license__txt { display: flex; align-items: center; line-height: 1; }
.license__txt--noicon { justify-content: space-between; }
.license__txt--noicon .license__txt__cate > small { position: relative; bottom: 6px; font-size: 70%; }
.license--nolist .license__ttl { text-align: center; }
.license--nolist .license__txt { justify-content: center; }

.license__txt__img { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; margin-right: 15px; }
.license__txt__img:before { font-family: 'chart'; font-size: 5.0rem; font-weight: normal; }
.license__txt__img--math:before { content: "a"; }
.license__txt__img--sci:before { content: "s"; }
.license__txt__img--info:before { content: "i"; }
.license__txt__img--eng:before { content: "e"; }
.license__txt__img--arc:before { content: "r"; }
.license__txt__cate { margin-right: 15px; font-size: 5.0rem; font-weight: 400; }
.license__txt__list { flex:1; font-size: 1.4rem; }
.license__txt__list__item:not(:last-child) { margin-bottom: 10px; }
.license__txt__list__item:before { margin-right: 5px; content: "\25B8"; }

.license--center { text-align: center; }
.license__txt--qualification { display: inline-flex; justify-content: center; }
.license__txt__subcate { flex: 1;  font-size: 2.5rem; font-weight: 500; }
.license__txt__extra { margin-top: 25px; font-size: 1.4rem; text-align: center; line-height: 1.5; color: #000; }
.qualification { margin-bottom: 20px; }
.qualification__img { margin-bottom: 10px; }
.qualification__txt { font-size: 1.4rem; text-align: center; line-height: 1.5; color: #000; }
.qualification__txt strong { font-size: 1.8rem; color: #af8d36; }
.qualification__img--1 img { width: 85%; }
.qualification__img--2 img { width: 70%; }

.komenum-notice { text-indent: -1.8em; padding-left: 1.8em; }
.qualification-notice { font-size: 1.3rem; line-height: 1.4; color: #000; text-align: left; }
.qualification-notice li:not(:last-child) { margin-bottom: 10px; }

@media screen and (max-width: 413px) {
	.license__txt--noicon { flex-wrap: wrap; }
	.license__txt--noicon .license__txt__cate { width: 100%; margin-bottom: 10px; }
	.license__txt--noicon .license__txt__list { display: flex; justify-content: space-between; flex-wrap: wrap;}
	.license__txt--noicon .license__txt__list__item { width: 50%; }
}
@media screen and (min-width: 413px) {
	.license__txt__subcate { font-size: 1.5em; }
	.license__txt__subcate br { display: none; }
}




@media screen and (min-width: 768px) {
	
	.license-wrap { display: flex; flex-wrap: wrap; }
	.license { width: 50%; }
	.license--center { width: 100%; }
	.license__txt__subcate { margin-left: -10px; }
	
}
@media only screen and (min-width: 768px) and (max-width: 810px) {
	
	.license__txt__cate { margin-right: 12px; font-size: 4.6rem; }
	
}


@media screen and (min-width: 1091px) {
	
	.rbtitl-number--md { font-size: 6.0rem; }
	.rbtitl-number--md:after { font-size: 50%; }
	.rbtitl-number--lgxs { font-size: 7.0rem; }
	
	.graph-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
	.graph { width: 50%; padding: 80px; }
	.graph--arc { padding-left: 0; padding-right: 0; }
	.graph__ttl { max-width: 230px; margin-left: auto; margin-right: auto; margin-bottom: 30px; font-size: 2.4rem; }
	.graph--student { width: 100%; }
	.graph-chart { padding-top: 0; }
	.graph-chart__student:before { top: 50%; bottom: inherit; transform: translateY(-50%) rotate(90deg); height: 50px; }
	.graph-chart__student--male:before { right: -46px; }
	.graph-chart__student--female:before { left: -46px; }
	.graph-chart__student:after { position: absolute; transform: rotate(45deg); display: block; width: 1px; height: 50px; content: ""; }
	.graph-chart__student--male:after { right: -88px; top: 4px; }
	.graph-chart__student--female:after { left: -89px; top: 39px; }
	
	.graph-wrap--engineering .graph-chart__student--female:before { transform: translateY(-80px) rotate(90deg); height: 90px; }
	.graph-wrap--engineering .graph-chart__student--female:after { left: -109px; top: 4px; }
	
	.graph-chart__student--male { transform: translateX(-230px); top: inherit; bottom: 0; }
	.graph-chart__student--female { transform: translateX(230px); }
	.graph-chart__student--female3keta { transform: translateX(414px); }
	.student-txt span { margin-bottom: 14px; font-size: 1.8rem; }
	.student-img { width: 50px; height: 88px; }
	.student-img:before { font-size: 8.8rem; }
	
	.graph-chart__circle,
	.circle-chart { width: 320px; height: 320px; }
	
	.graph--teacher { border-right: 1px solid; border-bottom: none; }
	.teacher { flex-direction: column; }
	.teacher__img { margin-right: 0; margin-bottom: 24px; }
	.license { width: 100%; }
	.license__ttl .spacer { margin-right: 75px; }
	.license__txt__img { width: 60px; height: 60px; }
	.license__txt__img:before { font-size: 6.0rem; }
	.license__txt__cate { font-size: 6.0rem; }
	
	.komenum-notice { margin-left: 80px; margin-right: 80px; }
	
}

@media screen and (max-width: 374px) {	/* 360px */
	.rbtitl-number--md { font-size: 4.4rem; }
	.rbtitl-number--xs { font-size: 3.2rem; }
	.license__txt__cate { font-size: 4.3rem; }
}


/*	coloring	*/
.graph-wrap--science { color: #458bb3; }
.graph-wrap--science,
.graph-wrap--science .graph--student,
.graph-wrap--science .graph__ttl { border-color: #458bb3; }
.graph-wrap--science .graph-chart__student--female { color: #83badb; }
.graph-wrap--science .graph-chart__student--male:before,
.graph-wrap--science .graph-chart__student--male:after { background-color: #458bb3; }
.graph-wrap--science .graph-chart__student--female:before,
.graph-wrap--science .graph-chart__student--female:after { background-color: #83badb; }

.graph-wrap--engineering { color: #8d7994; }
.graph-wrap--engineering,
.graph-wrap--engineering .graph--student,
.graph-wrap--engineering .graph__ttl { border-color: #8d7994; }
.graph-wrap--engineering .graph-chart__student--female { color: #c7a5cc; }
.graph-wrap--engineering .graph-chart__student--male:before,
.graph-wrap--engineering .graph-chart__student--male:after { background-color: #8d7994; }
.graph-wrap--engineering .graph-chart__student--female:before,
.graph-wrap--engineering .graph-chart__student--female:after { background-color: #c7a5cc; }
.graph-wrap--engineering .graph-chart__student--female:before{ left: -66px !important;}
.graph-wrap--engineering .graph-chart__student--female:after { left: -129px !important;}

.graph-wrap--biological { color: #558049; }
.graph-wrap--biological,
.graph-wrap--biological .graph--student,
.graph-wrap--biological .graph__ttl { border-color: #558049; }
.graph-wrap--biological .graph-chart__student--female { color: #a4ce95; }
.graph-wrap--biological .graph-chart__student--male:before,
.graph-wrap--biological .graph-chart__student--male:after { background-color: #558049; }
.graph-wrap--biological .graph-chart__student--female:before,
.graph-wrap--biological .graph-chart__student--female:after { background-color: #a4ce95; }

.graph-wrap--architecture { color: #af8d36; }
.graph-wrap--architecture,
.graph-wrap--architecture .graph--student,
.graph-wrap--architecture .graph__ttl { border-color: #af8d36; }
.graph-wrap--architecture .graph-chart__student--female { color: #eace76; }
.graph-wrap--architecture .graph-chart__student--male:before,
.graph-wrap--architecture .graph-chart__student--male:after { background-color: #af8d36; }
.graph-wrap--architecture .graph-chart__student--female:before,
.graph-wrap--architecture .graph-chart__student--female:after { background-color: #eace76; }

.graph-wrap--policy { color: #bf6e4a; }
.graph-wrap--policy,
.graph-wrap--policy .graph--student,
.graph-wrap--policy .graph__ttl { border-color: #bf6e4a; }
.graph-wrap--policy .graph-chart__student--female { color: #ddbba2; }
.graph-wrap--policy .graph-chart__student--male:before,
.graph-wrap--policy .graph-chart__student--male:after { background-color: #bf6e4a; }
.graph-wrap--policy .graph-chart__student--female:before,
.graph-wrap--policy .graph-chart__student--female:after { background-color: #ddbba2; }


.ttl-dep--main { position: relative; margin-bottom: 55px; padding-top: 32px; font-size: 1.6rem; text-align: center; line-height: 1; }
.ttl-dep--main span, .ttl-dep--main strong { position: relative; display: block; z-index: 5; }
.ttl-dep--main strong { margin-top: 15px; font-size: 225%; letter-spacing: 0.1em; }
.ttl-dep--main:after { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; font: 100 italic 5.0rem "Roboto", sans-serif; color: #f0f0f0; letter-spacing: 0.05em; z-index: 0; content: "What’s KSC?"; }

.ttl-dep--sub { font-size: 1.6rem; font-weight: 500; text-align: center; color: #1f3b80; line-height: 2; letter-spacing: 0.1em; }
@media screen and (max-width: 374px) {
	.ttl-dep--sub { font-size: 1.5rem; }
}

@media screen and (min-width: 768px) {
	
	.lead--sec1 { margin-bottom: 73px; }
	.ttl-dep--main { margin-bottom: 52px; padding-top: 58px; font-size: 1.8rem; }
	.ttl-dep--main strong { margin-top: 8px; font-size: 239%; letter-spacing: 0.2em; }
	.ttl-dep--main:after { font-size: 9.3rem; }
	.ttl-dep--sub { font-size: 2.3rem; line-height: 1.7; }
}







.lead--links { position: relative; left: 50%; transform: translateX(-50%); width: 100vw; background-color: #f6f6f6; padding: 30px 0; }
.links { width: 89.3%; margin-left: auto; margin-right: auto; }
.links__item { position: relative; display: flex; flex-direction: column; align-items: flex-end; background-color: #fff; padding: 20px; }
.links__item:not(:last-child) { margin-bottom: 10px; }
.links__item-img { position: absolute; top: 20px; left: 20px; width: 132px; height: auto; }
.links__item-ttl { width: calc(100% - 152px); color: #1f3b80; }
.links__item-ttl span, .links__item-ttl strong { display: block; }
.links__item-ttl span { font: 100 italic 1.2rem "Roboto", sans-serif; line-height: 1.35; }
.links__item-ttl strong { margin-top: 15px; font-size: 2.1rem; line-height: 1; }
.links__item-txt { margin-top: 35px; font-size: 1.4rem; line-height: 1.5; }


@media screen and (min-width: 768px) {
	
	.links__item-ttl span br { display: none; }
	.links__item { align-items: flex-start; padding: 30px 30px 30px 192px; }
	.links__item:not(:last-child) { margin-bottom: 20px; }
	.links__item-img { top: 50%; transform: translateY(-50%); left: 30px; }
	.links__item-ttl { width: 100%; }
	.links__item-ttl span { font-size: 1.3rem; }
	.links__item-ttl strong { margin-top: 10px; font-size: 3.0rem; }
	.links__item-txt { margin-top: 8px; font-size: 1.5rem; line-height: 1.5; }
	
}

@media screen and (min-width: 1280px) {
	
	.lead--links { width: 1180px; padding: 60px 0; }
	.links { width: 85.6%; margin-left: 60px; }
	.links__item-ttl strong { font-size: 3.6rem; letter-spacing: 0.2em; }
	
}







.chk-by-data-wrap { padding: 30px 0; }
@media screen and (min-width: 1091px) {
	
	.chk-by-data-wrap { padding: 0; }
	
}



.heading-5--dep { margin-bottom: 0; }
.pickup__content--dep { padding: 15px; background-color: #eef2f4; }


.dep-list-wrap:not(:last-child){ margin-bottom: 20px; }
.dep-list__item { background-color: #fff; padding: 20px; }
.dep-list__img { margin-bottom: 20px; }
.dep-list__ttl { border: solid #1f3b80; border-width: 1px 0 1px 0; padding: 10px 0; color: #1f3b80; }
.dep-list__ttl > ul { display: flex; align-items: center; }
.dep-list__ttl > ul .num { font: 300 italic 3.0rem "Roboto", sans-serif; line-height: 1; }
.dep-list__ttl > ul .sla { position: relative; width: 36px; height: 30px; overflow: hidden; }
.dep-list__ttl > ul .sla:before { position: absolute; transform: rotate(200deg) translateX(-50%) translateY(50%); top: 50%; left: 40%; width: 1px; height: 100%; background-color: #1f3b80; content: ""; }
.dep-list__ttl > ul .txt { font-size: 2.0rem; line-height: 1; letter-spacing: 0.1em; }
.dep-list__ttl > ul .txt sub { font-size: 1.2rem; bottom: 0.05em; }

.dep-list__txt { margin: 13px 0 15px; font-size: 1.4rem; color: #1f3b80; line-height: 1.65; }
.dep-list__lab { position: relative; background-color: #eef2f4; padding: 35px 20px 20px; }
.dep-list__lab:before { position: absolute; }
.dep-list__lab:before { top: 3px; left: 10px; font-size: 1.3rem; font-weight: 500; color: #fff; content: "学べる研究室"; z-index: 5; }
.dep-list__lab > span.label { position: absolute; top: 0; left: 0; width: 120px; height: 20px; overflow: hidden; }
.dep-list__lab > span.label:before { position: absolute; top: 0; left: 0; border-style: solid; border-width: 120px 120px 0 0px; content: ""; }
.dep-list__lab > span.label--science:before { border-color: #458bb3 transparent transparent; }
.dep-list__lab > span.label--engineering:before { border-color: #8d7994 transparent transparent; }
.dep-list__lab > span.label--biological:before { border-color: #558049 transparent transparent; }
.dep-list__lab > span.label--architecture:before { border-color: #af8d36 transparent transparent; }
.dep-list__lab > span.label--policy:before { border-color: #bf6e4a transparent transparent; }

.dep-list__lab > p { font-size: 1.4rem; line-height: 1.65; }




@media screen and (min-width: 1091px) {
	
	.dep-list-wrap:not(:last-child){ margin-bottom: 60px; }
	.pickup--dep { padding-top: 110px; }
	.pickup__content--dep { padding: 100px 110px 110px; }
	.dep-list__item { position: relative; display: flex; padding: 50px; }
	.dep-list__item--nolab { min-height: 364px; }
	.dep-list__img { position: absolute; top: 0; right: -110px; width: 410px; }
	
	.dep-list__txtwrap { width: calc(100% - 250px); }
	
	.dep-list__ttl > ul .num { font-size: 5.0rem; }
	.dep-list__ttl > ul .sla { width: 40px; height: 48px; }
	.dep-list__ttl > ul .sla:before { left: 30%; }
	.dep-list__ttl > ul .txt { font-size: 2.4rem; }
	.dep-list__ttl > ul .txt sub { font-size: 1.6rem; bottom: 0.05em; }
	
	.dep-list__txt { margin: 23px 0 25px; font-size: 1.8rem; }
	.dep-list__lab { width: calc(100% - 50px); }
	
	.dep-list__item:nth-child(2n) { justify-content: flex-end; }
	.dep-list__item:nth-child(2n) .dep-list__img { left: -110px;}
	.dep-list__item:nth-child(2n) .dep-list__ttl,
	.dep-list__item:nth-child(2n) .dep-list__txt { padding-left: 50px; }
	.dep-list__item:nth-child(2n) .dep-list__lab { width: calc(100% - 50px); margin-right: 0; margin-left: auto; }
	
	
}

.major__btn-wrap--dep { max-width: 300px; margin-top: 50px; margin-bottom: 60px; margin-left: auto; margin-right: auto; }
@media screen and (min-width: 1091px) {
	.major__btn-wrap--dep { margin-top: 100px; margin-bottom: 0px; }
}

.l-sp-bottom-white-line--bg-gray:after{ display: none !important;}