@charset "UTF-8";

@media print, screen and (min-width: 771px) {
	.display-sp {
		display:none !important;
	}
}

@media screen and ( max-width:770px) {
	.display-pc {
		display:none !important;
	}
}

div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0; 
	padding:0; 
	letter-spacing:0;
	color:#000;
	font-family: "Meiryo UI", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "Helvetica Neue", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal; 
	font-weight:normal; 
}
ul, ol, dl {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
caption,th {
	text-align:left; 
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%; 
	font-weight:normal; 
}
a:link {
	text-decoration: none;
}
a:visited {
	color:#000;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}

/* ----------------------- custom -------------------------------- */
* {
	box-sizing:border-box;
	margin: 0;
	padding: 0;
	transition: 0.1s ease-in-out;
}
img {
	margin:0;
	padding:0;
	vertical-align: bottom;
	width:100%;
}
a img {
	border: none;
}

a:hover img {
	-moz-opacity: 0.7; /* Firefox */
	filter: alpha(opacity=70); /* IE6/7 */
	-ms-filter: "alpha(opacity=70)"; /* IE8 */
	opacity:0.7;
	zoom:1;
}

/* ----------------------------------------------- */

@media print, screen and (min-width: 1551px) {
	.review-header-wrap {
		width:100%;
		height:190px;
		background:#000;
		overflow:hidden;
		position:relative;
	}
	.review-header-bg {
		position:absolute;
		width:2000px;
		top: 0;
    	left: 50%;
    	transform: translateX(-50%);
	}
	.header-typo-pc {
		position:absolute;
		width:1020px;
		top:0.41vw;
		left:0;
		mix-blend-mode:screen;
	}
	.header-title {
		position:absolute;
		width:465px;
		top:35px;
		left:50px;
	}
	.header-kenmira-logo {
		position:absolute;
		width:375px;
		top:32px;
		right:55px;
	}
}

@media print, screen and (min-width: 951px) and ( max-width:1550px) {
	.review-header-wrap {
		width:100%;
		height:12.5vw;
		overflow:hidden;
		position:relative;
	}
	.review-header-bg {
		position:relative;
		width:130%;
		top:0;
    	left:50%;
    	transform: translateX(-50%);
	}
	.header-typo-pc {
		position:absolute;
		width:65.8%;
		top:0.41vw;
		left:0;
		mix-blend-mode:screen;
	}
	.header-title {
		position:absolute;
		width:30%;
		top:2.2vw;
		left:3.2vw;
	}
	.header-kenmira-logo {
		position:absolute;
		width:24.193%;
		top:2.3vw;
		right:3.548vw;
	}
}

@media screen and (min-width:901px) and ( max-width:950px) {
	.review-header-wrap {
		width:100%;
		height:118.75px;
		overflow:hidden;
		position:relative;
	}
	.review-header-bg {
		position:absolute;
		width:1235px;
		top: 0;
    	left: 50%;
    	transform: translateX(-50%);
	}
	.header-typo-pc {
		position:absolute;
		width:625px;
		top:3.8px;
		left:0;
		mix-blend-mode:screen;
	}
	.header-title {
		position:absolute;
		width:285px;
		top:20px;
		left:30px;
	}
	.header-kenmira-logo {
		position:absolute;
		width:230px;
		top:21.85px;
		right:33px;
	}
}

@media screen and (min-width:671px) and ( max-width:900px) {
	.review-header-wrap {
		width:100%;
		height:118px;
		overflow:hidden;
		position:relative;
	}
	.review-header-bg {
		position:absolute;
		width:1235px;
		top: 0;
    	left: 50%;
    	transform: translateX(-50%);
	}
	.header-typo-pc {
		position:absolute;
		width:69%;
		top:0.42vw;
		left:0;
		mix-blend-mode:screen;
	}
	.header-title {
		position:absolute;
		width:285px;
		top:20px;
		left:17px;
	}
	.header-kenmira-logo {
		position:absolute;
		width:230px;
		top:21.85px;
		right:33px;
	}
}

@media screen and ( max-width:670px) {
	.review-header-wrap {
		width:100%;
		height:17.6vw;
		overflow:hidden;
		position:relative;
	}
	.review-header-bg {
		position:absolute;
		width:184.33%;
		top: 0;
    	left: 50%;
    	transform: translateX(-50%);
	}
	.header-typo-pc {
		position:absolute;
		width:69%;
		top:0.41vw;
		left:0;
		mix-blend-mode:screen;
	}
	.header-title {
		position:absolute;
		width:48%;
		top:3.6vw;
		left:1.7vw;
	}
	.header-kenmira-logo {
		position:absolute;
		width:35.5%;
		top:3vw;
		right:5vw;
	}
}

/* ----------------------------------------------- */

@media print, screen and (min-width: 771px) {
	.review-top-wrap {
		background:#dcdad7;
		padding:0 60px 75px;
		overflow:hidden;
	}
	.review-top-inner {
		max-width:1200px;
		margin:0 auto;
		position:relative;
	}
	.review-top-title {
		margin-bottom:50px;
		position:relative;
		z-index:2;
	}
	.panelist-wrap {
		max-width:1000px;
		margin:0 auto;
		display:flex;
		justify-content: space-between;
		position:relative;
		z-index:3;
	}
	.panelist-block {
		width:73.333%;
	}
	.facilitator-block {
		width:20%;
	}
	.panelist-block-inner {
		width:100%;
		display:flex;
		justify-content: space-between;
	}
	.panelist-box {
		width:27.273%;
	}
	.role-text-pane {
		font-size:16px;
		margin:0 0 12px -7px;
		display: flex;
		align-items: center;
	}
	.role-text-pane:after {
		content: "";
		height: 1px;
		flex-grow: 1;
		background-color: #444;
		margin-left: 4px;
	}
	.role-text-faci {
		font-size:16px;
		margin:0 0 12px -7px;
	}
	.panelist-photo,
	.facilitator-photo {
		margin-bottom:12px;
	}
	.panelist-katagaki {
		font-size:14.5px;
		line-height:1.4;
		text-align:center;
		margin-bottom:4px;
	}
	.panelist-name {
		font-size:25px;
		font-weight:bold;
		text-align:center;
	}
	.panelist-name span {
		font-size:15px;
		font-weight:bold;
	}
	.hex-bg {
		position:absolute;
		width:550px;
		bottom:70px;
		left:-170px;
		mix-blend-mode:overlay;
		z-index:1;
	}
}

@media screen and (min-width:771px) and ( max-width:1120px) {
	.review-top-title {
		margin-bottom:4.4642vw;
	}
	.panelist-katagaki {
		font-size:13.5px;
	}
	.panelist-name {
		font-size:23px;
	}
}

@media screen and (min-width:771px) and ( max-width:1000px) {
	.review-top-wrap {
		padding:0 60px 65px;
	}
	.panelist-katagaki {
		font-size:12.5px;
	}
}
@media screen and (min-width:771px) and ( max-width:950px) {
	.panelist-katagaki {
		font-size:12px;
	}
}

@media print, screen and (min-width: 931px) {
	.hex-bg-02 {
		display:none !important;
	}
}

@media screen and (min-width:771px) and ( max-width:930px) {
	.panelist-wrap {
		display:block;
		justify-content: normal;
	}
	.panelist-block {
		width:100%;
		margin-bottom:40px;
	}
	.facilitator-block {
		width:100%;
	}
	.role-text-pane {
		margin:0 0 14px -7px;
	}
	.role-text-faci {
		display: flex;
		align-items: center;
		margin:0 0 14px -7px;
	}
	.role-text-faci:after {
		content: "";
		height: 1px;
		flex-grow: 1;
		background-color: #444;
		margin-left: 4px;
	}
	.facilitator-box {
		width:27.273%;
	}
	.panelist-katagaki {
		font-size:14px;
	}
	.panelist-name {
		font-size:25px;
	}
	.hex-bg-02 {
		position:absolute;
		width:400px;
		top:180px;
		left:-170px;
		mix-blend-mode:overlay;
		z-index:1;
	}
	.hex-bg {
		position:absolute;
		width:400px;
		bottom:5vw;
		left:auto;
		right:-120px;
		mix-blend-mode:overlay;
		z-index:1;
	}
}
@media screen and (min-width:771px) and ( max-width:850px) {
	.panelist-katagaki {
		font-size:13px;
	}
}

@media screen and ( max-width:770px) {
	.review-top-wrap {
		background:#dcdad7;
		overflow:hidden;
	}
	.review-top-inner {
		position:relative;
	}
	.review-top-title {
		margin-bottom:18px;
		position:relative;
		z-index:2;
	}
	.panelist-wrap {
		width:84%;
		margin:0 auto;
		position:relative;
		z-index:3;
	}
	.role-text-pane {
		font-size:16px;
		margin:0 0 10px -7px;
		display: flex;
		align-items: center;
	}
	.role-text-pane:after {
		content: "";
		height: 1px;
		flex-grow: 1;
		background-color: #444;
		margin-left: 4px;
	}
	.role-text-faci {
		font-size:16px;
		margin:0 -7px 3px 0;
	}
	.panelist-box,
	.facilitator-box {
		display:flex;
		justify-content: space-between;
	}
	.panelist-photo,
	.facilitator-photo {
		width:36%;
	}
	.panelist-text-wrap {
		width:60%;
		padding-top:6vw;
	}
	.panelist-text-wrap-spleft {
		text-align:right;
	}
	.panelist-katagaki {
		font-size:17px;
		line-height:1.4;
		margin-bottom:3px;
	}
	.panelist-name {
		font-size:26px;
		font-weight:bold;
	}
	.panelist-name span {
		font-size:16px;
		font-weight:bold;
	}
	.hex-bg-02 {
		position:absolute;
		width:55%;
		top:48vw;
		right:10px;
		mix-blend-mode:overlay;
		z-index:1;
	}
	.hex-bg {
		position:absolute;
		width:55%;
		bottom:7vw;
		left:10px;
		mix-blend-mode:overlay;
		z-index:1;
	}
}

@media screen and ( max-width:600px) {
	.panelist-wrap {
		width:90%;
	}
	.role-text-pane,
	.role-text-faci {
		font-size:15px;
	}
	.panelist-photo,
	.facilitator-photo {
		width:34%;
	}
	.panelist-text-wrap {
		width:62%;
		padding-top:6vw;
	}
	.panelist-katagaki {
		font-size:15px;
		line-height:1.4;
		margin-bottom:2px;
	}
	.panelist-name {
		font-size:22px;
		font-weight:bold;
	}
	.panelist-name span {
		font-size:14px;
		font-weight:bold;
	}
}

@media screen and ( max-width:450px) {
	.role-text-pane,
	.role-text-faci {
		font-size:13px;
	}
	.panelist-photo,
	.facilitator-photo {
		width:33%;
	}
	.panelist-text-wrap {
		width:63%;
		padding-top:6vw;
	}
	.panelist-katagaki {
		font-size:13px;
		line-height:1.4;
		margin-bottom:2px;
	}
	.panelist-name {
		font-size:19px;
		font-weight:bold;
	}
	.panelist-name span {
		font-size:13px;
		font-weight:bold;
	}
}

.bg-body {
	background:#fafaf8;
}

.body-wrap {
	position:relative;
	background:#fff;
}

@media print, screen and (min-width: 1201px) {
	.body-wrap {
		max-width:1200px;
		margin:0 auto;
		padding:90px 40px 120px 100px;
	}
}

.body-wrap-inner {
	display:flex;
	justify-content: space-between;
}

.body-text-wrap {
	width:64.15%;
}

.side-menu-wrap {
	width:26.415%;
}

@media screen and (min-width:771px) and ( max-width:1200px) {
	.body-wrap {
		padding:75px 40px 120px 60px;
	}
	.body-text-wrap {
		width:66%;
	}
}

@media screen and ( max-width:770px) {
	.body-wrap {
		padding:50px 8% 160px;
	}
	.body-text-wrap {
		width:100%;
	}
}

.body-heading {
	margin-bottom:18px;
}

.body-heading2 {
	margin:85px 0 18px;
}

.body-text {
	font-size:18px;
	line-height:1.65;
	text-align: justify;
	margin-bottom:35px;
}

.body-text span.name {
	font-size:18px;
	font-weight:bold;
	color:#8c6239;
	line-height:1.65;
}

.body-img-wrap {
	width:95%;
	margin:50px auto 55px;
}

.body-img-caption {
	margin-top:8px;
	font-size:13.3px;
	text-align: justify;
}

.kakudai-link-wrap {
	display:block;
	margin:0 auto;
}

.zu-sp {
	margin:0 auto;
}

@media screen and ( max-width:450px) {
	.body-heading2 {
		margin:55px 0 18px;
	}
	.body-text {
		font-size:16px;
		margin-bottom:28px;
	}
	.body-text span.name {
		font-size:16px;
	}
	.body-img-wrap {
		width:100%;
		margin:35px auto 40px;
	}
	.body-img-caption {
		font-size:12.5px;
	}
}

.katagaki-kome {
	font-size:11px;
	color:#000;
	margin-top:60px;
}

@media screen and ( max-width:660px) {
	font-size:10px;
}

.side-menu-title {
	width:100%;
	height:38px;
	background:#000;
	font-size:14px;
	font-weight:bold;
	letter-spacing:2px;
	color:#fff;
	line-height:38px;
	padding-left:15px;
	margin-bottom:30px;
}

.side-menu-link-01 {
	display:block;
	margin-bottom:42px;
}

.side-menu-border {
	border-bottom:1px solid #ccc;
	margin-bottom:50px;
}

.side-menu-link-02 {
	display:block;
	margin-bottom:48px;
}

.side-menu-img {
	margin-bottom:6px;
}

.side-menu-caption {
	font-size:15px;
	font-weight:bold;
	line-height:1.55;
}

.side-menu-link-01:hover .side-menu-caption,
.side-menu-link-02:hover .side-menu-caption {
	opacity:0.7;
}

@media print, screen and (min-width:771px) {
	.arrow-top {
		position:absolute;
		display:block;
		width:100px;
		right:110px;
		bottom:65px;
		z-index:11;
	}
}

@media screen and ( max-width:770px) {
	.arrow-top {
		position:absolute;
		display:block;
		width:75px;
		left:50%;
		transform: translateX(-50%);
		bottom:30px;
		z-index:11;
	}
}

@media print, screen and (min-width: 771px) {
	.footer-block {
		background:#534741;
		padding:50px 30px 35px;
	}
	.footer-inner {
		max-width:1200px;
		margin:0 auto;
		display:flex;
		justify-content: space-between;
	}
	.logo-footer {
		width:420px;
		padding-top:20px;
	}
	.foot-menu-wrap {
		padding-right:90px;
	}
	a.foot-menu {
		display:block;
		font-size:15px;
		color:#fff;
		margin-bottom:20px;
	}
}
@media screen and (min-width:771px) and ( max-width:900px) {
	.logo-footer {
		width:370px;
		padding-top:20px;
	}
}
@media screen and ( max-width:770px) {
	.footer-block {
		background:#534741;
		padding:35px 30px 25px;
	}
	.footer-inner {

	}
	.logo-footer {
		max-width:300px;
		margin:0 auto 40px;
	}
	.foot-menu-wrap {
		width:200px;
		margin:0 auto;
		padding-left:20px;
	}
	a.foot-menu {
		display:block;
		font-size:15px;
		color:#fff;
		margin-bottom:17px;
	}
}

.logo-footer:hover {
	opacity:0.7;
}

a.foot-menu:hover {
	color:#ecc126;
}

