@charset "UTF-8";

/* font ---------------------------------------
Noto Sans Japanese：font-family: "Noto Sans Japanese";
さわらびゴシック：font-family: "Sawarabi Gothic";
 ---------------------------------------*/
 
/* TOP画像 ------------------------- */
#wrapper #contents > .img span {
    top: 17%;
    left: 5%;
}
#wrapper #contents > .img span:last-of-type {
    top: 31%;
}
 
/* コンテンツ ------------------------- */
#cntWrapper .profile #profileBlock {
    width: 800px;
    margin: 0px auto;
    display: grid;
    display: -ms-grid;
    grid-template-columns: 280px 1fr;
    grid-template-rows: [gName] 55px [gList] auto [gList-end] auto;
    -ms-grid-columns: 280px 1fr;
    -ms-grid-rows: auto 50px 1fr;
}

#cntWrapper .profile #profileBlock .gPhoto {
    grid-column: 1 / 1;
    grid-row: gName /gList-end;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
}
#cntWrapper .profile #profileBlock .gName {
    font-size: 50px;
    font-weight: bold;
    padding: 10px 0 0 4%;
    grid-column: 2 / 3;
    grid-row: gName /gList;
    -ms-grid-column: 2;
    -ms-grid-row: 1;
}
#cntWrapper .profile #profileBlock .gName span {
    font-size: 24px;
    font-weight: normal;
}
#cntWrapper .profile #profileBlock .gList {
    grid-column: 2 / 3;
    grid-row: gList /gList-end;
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    list-style: none;
    padding: 10px 0 0 4%;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#cntWrapper .profile #profileBlock .gList:not(:target) {
			margin: 59px 0 0 0;
	}
}






#cntWrapper .profile#contents h1 {
    background: url("../images/icon.png") left bottom no-repeat;
    border-bottom: 3px solid #1e5799;
    text-align: center;
    position: relative;
    height:90px;
    font-size: 25px;
    line-height: 4.8em;
    font-family: "Noto Sans Japanese";
    margin-bottom: 45px;
}
#cntWrapper .profile #history {
	margin-bottom: 60px;
}
#cntWrapper .profile #history .inner .ph {
    position: absolute;
    right: 0;
    max-width: 320px;
    width: 40%;
}
#cntWrapper .profile #history .inner {
    position: relative;
}
#cntWrapper .profile #history .inner .ph img {
    width: 100%;
}
#cntWrapper .profile section table th {
    width: 100px;
    text-align: left;
    font-weight: normal;
    height: 35px;
}


@media screen and (max-width: 1200px) {
#cntWrapper .profile #profileBlock {
    width: 95%;
    margin-bottom: 30px;
    grid-template-columns: 29% 1fr;
    grid-template-rows: [gName] 50px [gList] auto [gList-end] auto;
    -ms-grid-columns: 30% 1fr;
    -ms-grid-rows: auto 50px 1fr;
}
	#cntWrapper .profile #profileBlock .gPhoto img {
		width: 100%;
		max-width: 280px;
	}
	#cntWrapper .profile #profileBlock .gName {
		font-size: 5vmin;
	}
	#cntWrapper .profile #profileBlock .gName span {
		font-size: 15px;
	}
}


@media screen and (max-width: 768px) {
}


@media screen and (max-width: 480px) { /*smartphone*/
	#cntWrapper .profile #profileBlock .gName {
		font-size: 28px;
		line-height: 1.5em;
		margin-bottom: 5px;
		padding-top: 0;
	}
	#cntWrapper .profile #profileBlock .gName span {
		display: block;
		margin: -16px 0 0 -7px;
		font-size: 12px;
	}
	#cntWrapper .profile#contents h1 {
		background-size: 40px;
		background-position: 4% bottom;
		margin-bottom: 20px;
	}
	#cntWrapper .profile #profileBlock {
		margin-bottom: 10px;
	}
	#cntWrapper .profile #history {
		margin-bottom: 10px;
	}
	#cntWrapper .profile #history .inner .ph {
		position: initial;
		margin: 0px auto;
		width: 100%;
	}
	#cntWrapper .profile section table th {
		width: 74px;
	}

	#cntWrapper .profile section table td {
		line-height: 1.5em;
		padding-bottom: 9px;
	}
}