@charset "utf-8";
/*
* プロフィールページ page-id-108
*
*/
.page-id-108 .site-content {
	/* 背景色 */
	background-color: #f2f1ee;
}
/*
* KV周辺
*/
.page-id-108 .kv_background {
	--left-color: #f3f3f3;
	--right-color: #f3f3f3;
	/* 背景色をグラデーションにして、KVの画像の切れ目を見えなくする */
	background: -webkit-gradient(linear, left center, right center, color-stop(0.50, var(--right-color)), color-stop(0.50 var(--left-color)));
	background: -webkit-linear-gradient(left, var(--left-color) 50%, var(--right-color) 50%);
	background: -moz-linear-gradient(left, var(--left-color) 50%, var(--right-color) 50%);
	background: -o-linear-gradient(left, var(--left-color) 50%, var(--right-color) 50%);
	background: -ms-linear-gradient(left, var(--left-color) 50%, var(--right-color) 50%);
	background: linear-gradient(to right, var(--left-color) 50%, var(--right-color) 50%);
}
/* 画像を中央に揃える */
.page-id-108 .kv {
	margin: 0px -480px; /* 左右marginは((画像横幅 - 960) / 2)にする */
	height: auto;
}
img.pc{ display: block;}
img.sp{ display: none;}

/*
* 高橋ゆきの歩み
*/
/* 白箱を配置する外枠 */
.ayumi {
	position: relative;
	margin-bottom: -750px;
}

/* 翻訳用にイベントを透過させる */
.page-id-108 div.ayumi {
	pointer-events: none;
}

/* あゆみの白箱 */
.ayumi-whitebox {
	position: relative;
	background: none !important;
	width: auto !important;
	padding: 0 !important;
}
.ayumi-whitebox-inner{
	width: 411px;
	background-color: #ffffff;
	padding: 45px 40px 50px;
	position: relative;
}

/* あゆみの白箱内フォント */
.h1-in-whitebox {
	font-size: 20px;
	margin-bottom: 35px;
}
.h2-in-whitebox {
	border-bottom: 2px solid #e4017f;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 0px;
}
.text-in-whitebox {
	font-size: 14px;
}
/* 時代を表す縦線・アイコン */
.era-line {
	position: absolute;
	top : 50px;
	left: 470px;
	width : 0px;
	height:         1600px;
	border: 2px solid #e4017f;
}
.era-point {
	position: absolute;
	top : 0;
	left: -95px;
	z-index: 0;
}
.ayumi-whitebox:nth-child(2n) .era-point {
	left: 444px;
}
.era-point img {
	position: relative;
	top : 0;
	left: 0;
	z-index: 9999;
	width: 60px;
	height: 60px;
}
/* 高校・大学・新卒時代 */
.koukou {
	top: -120px;
	left: 538px;
}

/* 人生どん底時代 */
.jinsei {
	top: -315px;
	left: 0px;
}

/* 香港時代 */
.hongkong {
	top: -372px;
	left: 538px;
}

/* 帰国・創業時代 */
.kikoku {
	top: -808px;
	left: 0px;
}
/* そして、今 */
.now {
	width: 911px;
	left: 0px;
	top: -762px;
}
.now .ayumi-whitebox-inner{
	width: 100%;
}
.ayumi-whitebox.now .ayumi-whitebox-inner::before{
	display: none;
}
.now .h1-in-whitebox {
	text-align: center;
	margin-bottom: 10px;
}
.now .h2-in-whitebox {
	margin-left: auto;
	margin-right: auto;
	width: 60px;
	text-align: center;
}
.now .main-in-whitebox {
	display: flex;
	width: 100%;
}
.now .text-in-whitebox {
	width: 60%;
	display: flex;
	align-items: center;
	/* vertical-align: middle; */
}
.now .text-in-now {
	width: max-content;
	margin-left: auto;
	margin-right: auto;
}
.now .img-in-whitebox {
	width: 40%;
}
/* 吹き出しと丸アイコン */
.ayumi-whitebox .ayumi-whitebox-inner::before {
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	right: -15px;
	top: 35px;
	border-left: 15px solid #ffffff;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
}
.ayumi-whitebox.koukou .ayumi-whitebox-inner::before,
.ayumi-whitebox.hongkong .ayumi-whitebox-inner::before {
	right: auto;
	left: -15px;
	top: 35px;
	border-left: 0;
	border-right: 15px solid #ffffff;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
}
.shoujo .era-point{
	top: 18px;
}
.koukou .era-point{
	top : 20px;
}
.jinsei .era-point{
	top: 17px;
}
.hongkong .era-point{
	top: 14px;
	left: -104px;
}
.hongkong .era-point img{
	width : 72px;
	height: 72px;
}
.kikoku .era-point{
	top  : 20px;
}
.now .era-point{
	top: -30px;
	left : 440px;
}
/*
* プロフィール
*/
/* 翻訳 */
.translate {
	margin-top: -24px;
	position: relative;
	top: -18px;
}
/* プロフィールの白箱 */
.profile-whitebox {
	background-color: #ffffff;
	padding: 60px;
	position: relative;
	margin-bottom: 60px;
}
/* プロフィールの白箱内フォント */
.profile-whitebox .h1-in-whitebox {
	font-size: 20px;
	margin-bottom: 0px;
	padding-left: 17px;
	display: inline;
}
.profile-whitebox .h1-in-whitebox{
	padding-left: 0;
}
.profile-whitebox.single .h1-in-whitebox{
	padding-left: 17px;
}
.profile-whitebox .h1-in-whitebox.sp{ display: none;}
.profile-whitebox .h1-in-whitebox.pc{ display: block;}
.profile-whitebox .h1-after-in-whitebox {
	font-size: 12px;
	margin-bottom: 0px;
	display: inline;
}
.profile-whitebox .h2-in-whitebox {
	border-bottom: 1px solid #aaaaaa;
	font-size: 12px;
	font-weight: bold;
	margin-top: 20px;
	padding-bottom: 5px;
}
.profile-whitebox .text-in-whitebox {
	font-size: 14px;
}
.profile .translate {
	display: inline-block;
	float: right;
	text-align: right;
	top: -22px;
	margin: 0 0 18px 0;
}
.profile .translate > a {
	display: inline-block;
	color: #e4017f;
	margin-right: 10px;
	text-decoration-line: underline;
	font-size: 16px;
}
.profile .translate > a:hover{
	cursor: pointer;
}
.profile .en{
	display: none;
}
.profile .ja{
	display: none;
}
.profile img.pc {
	display: inline-block;
	width : 23px;
	height: 17px;
}

/* 経営者、家事研究家、家事大学学長、日本の暮らし方研究家共通 */
.profile-whitebox.role .text_and_arrow a.textlink {
	/* 文字リンクの調整 */
	margin-right: 30px;
	font-weight: bold;
}
.role .h1-in-whitebox:before {
	content: "";
	border-left: 4px solid;
	position: relative;
	padding-right: 13px;
	margin-left: -17px;
}
.role .h1-in-whitebox {
	/* タイトル（役割）周辺 */
	display: block;
	margin-bottom: 30px;
	font-size: 18px;
}

/* 経営者と家事研究家共通部分  */
.profile-whitebox.single {
	display: flex;
	margin-bottom: 30px; /* 次要素との縦マージン調整 */
}
.profile-whitebox.single > div {
	/* 経営者と家事研究家の中身は2カラムに */
	width: 50%;
}
/* 経営者
*/
/* 見出し横のボーダー */
.keieisha .h1-in-whitebox:before {
	color: #1f77c8;
}
/* リンクのカラー */
.keieisha a.textlink {
	color: #1f77c8;
}
/* 家事研究家
*/
/* 見出し横のボーダー */
.kajikenkyuka .h1-in-whitebox:before {
	color: #de5d94;
}
/* リンクのカラー */
.kajikenkyuka a.textlink {
	color: #de5d94;
}
/* 家事大学学長と日本の暮らし方研究家
*/
/* 1x2レイアウトに変更、2つの箱の間のマージンの指定 */
.sidebyside{
	display: flex;
}
.kajidaigakugakucho {
	margin-right: 15px;
}
.nihonkurashikata{
	margin-left: 15px;
}
/* 1x2レイアウトなので、内部のマージンは0pxにして、2つを囲っているdivでマージンを取る */
.kajidaigakugakucho,
.nihonkurashikata {
	margin-bottom: 0px;
}
.sidebyside{
	margin-bottom: 49px;
}
.sidebyside .profile-whitebox{
	padding: 40px 30px 40px 30px;
}
/* 家事大学学長 */
/* 見出し横のボーダー */
.kajidaigakugakucho .h1-in-whitebox:before {
	color: #7c9a17;
}
/* リンクのカラー */
.kajidaigakugakucho a.textlink {
	color: #7c9a17;
}
/* 家事大学学長 */
/* 見出し横のボーダー */
.nihonkurashikata .h1-in-whitebox:before {
	color: #d78f28;
}
/* リンクのカラー */
.nihonkurashikata a.textlink {
	color: #d78f28;
}

/*
* 公職
*/
.koshoku {
	justify-content: space-between;
	display: flex;
	flex-wrap: wrap;
}
.koshoku-contents {
	width: 50%;
}
.koshoku .contents-left {
	padding-right: 15px;
}
.koshoku .contents-right {
	padding-left: 15px;
}
.koshoku-contents {
	font-size: 14px;
}
.contents-top {
	border-top: 1px solid #aaaaaa;
	border-bottom: 1px solid #aaaaaa;
	height: 40px;
	line-height: 40px;
}
.contents-bottom {
	border-bottom: 1px solid #aaaaaa;
	height: 40px;
	line-height: 40px;
}
/*
* 関わる団体・プロジェクト
*/
/* 全体を囲う要素 */
.project {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 80px;
}
/* 団体・プロジェクト1つずつの要素 */
.project .project-contents {
	display: flex;
	width: 50%;
	margin-bottom: 20px;
}
/* 左側に配置される要素 */
.project .contents-left {
	padding-right: 15px;
}
/* 右側に配置される要素 */
.project .contents-right {
	padding-left: 15px;
}
/* アイコン要素 */
.project .project-img {
	height:70px
}
/* テキスト要素 */
.project .project-text {
	display: flex;
	align-items: center;
	margin-left: 15px;
	font-weight: bold;
}
/* 書籍ページへ、お問い合わせ */
.links {
	margin-bottom: 120px;
}
.links .link-item {
	margin-bottom: 40px;
}
.links .link-item .text {
	text-align: center;
	margin-bottom: 20px;
}


.text-in-whitebox{
	margin-top: 14px;　　
}
.profile-whitebox .h2-in-whitebox.positionTitle{
	margin-top: 10px;
	font-weight:normal;
	padding-bottom: 20px;
}
.profile-whitebox .text-in-whitebox{
	margin-top: 30px
}

.text_and_arrow{
	margin-top: 20px;
}
.img-in-whitebox{
	margin-top: 20px;
}
.textlink.movie img{
	margin-right: 7px;
	margin-bottom: -3px;
}
.sidebyside .profile-whitebox{
	min-width: 465px;
}
.sidebyside{
	margin-bottom: 80px;
}
.img-in-whitebox.prof{
	margin-top:0;
}
.project .project-text{
	margin-top: 23px;
}

.now .img-in-whitebox:after{
	content:"";
	background: url(/yukitakahashi/wp/wp-content/uploads/2018/05/bear-1.png);
	background-size: 116px 140px;
	position: absolute;
	bottom: 20px;
	right: -12px;
}
.koshoku{
	margin-bottom:70px;
}
.now{
	top: -655px;
	width:950px;
}

.ayumi{
	margin-bottom: -640px;
}
.era-line{
	height: 1560px;
}

.list-mv01 img{
	transform: scale(0, 0);
	-webkit-transform: scale(0, 0);
	transition: .4s;
}
.mv01 img{
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
}
.ayumi-whitebox .ayumi-whitebox-inner{
	transform: translate(40px,0);
	-webkit-transform: translate(40px,0);
	transition: .7s;
}
.ayumi-whitebox:nth-child(2n) .ayumi-whitebox-inner{
	transform: translate(-40px,0);
	-webkit-transform: translate(-40px,0);
}
.ayumi-whitebox .ayumi-whitebox-inner.mv05,
.ayumi-whitebox:nth-child(2n) .ayumi-whitebox-inner.mv05{
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
}
.bears_button img{
	margin-left: 10px;
}



/*
* SP
*
*/
@media screen and (max-width: 767px) {
	/* 共通 */
	.wrap{
		display: block;
		width: 100%;
		margin : 0;
		padding: 0;
	}
	body #breadcrumb{
		width: 100%;
		margin: 0;
	}

	img.pc{ display: none;}
	img.sp{ display: block;}

	.kv {
		width: 100%;
	}
	.page-id-108 .kv {
		margin: 0;
	}
	.kv_container{
		width: 100%;
	}
	.kv > img{
		width : 100%;
		height: auto;
	}
	.h1-in-whitebox {
		font-size: 16px;
		margin-bottom: 22px;
	}
	.h2-in-whitebox {
		border-bottom: 2px solid #e4017f;
		font-size: 14px;
		font-weight: bold;
		margin-bottom: 0px;
	}
	.text-in-whitebox {
		margin-top: 8px;
	}
	.era-line {
		position: absolute;
		top : 16px;
		left: 50px;
		width : 0px;
		height: 80%;
		border: 2px solid #e4017f;
	}
	.era-point {
		position: absolute;
		top: 0;
		left: -52px;
	}
	.era-point img {
		width : 36px;
		height: 36px;
	}
	.shoujo .era-point {
		top: 12px;
	}
	.koukou .era-point {
		top: 12px;
	}
	.hongkong .era-point {
		top: 6px;
		left: -55px;
	}
	.hongkong .era-point img {
		width : 42px;
		height: 42px;
	}
	.kikoku .era-point {
		top: 4px;
	}
	.now .era-point {
		top: 12px;
		left: -55px;
	}
	.ayumi{
		margin-bottom: 50px;
	}
	.ayumi-whitebox:nth-child(2n) .era-point {
		left: -53px;
	}
	.ayumi-whitebox{
		margin : 0 38px 20px 85px !important;
		padding: 0 !important;
	}
	.ayumi-whitebox-inner{
		width: 100%;
		padding: 20px 22px 25px;
	}
	.ayumi-whitebox .ayumi-whitebox-inner::before,
	.ayumi-whitebox.shoujo .ayumi-whitebox-inner::before,
	.ayumi-whitebox.koukou .ayumi-whitebox-inner::before,
	.ayumi-whitebox.jinsei .ayumi-whitebox-inner::before,
	.ayumi-whitebox.hongkong .ayumi-whitebox-inner::before,
	.ayumi-whitebox.now .ayumi-whitebox-inner::before {
		content: "";
		display: inline-block;
		right: auto;
		top : 22px;
		left: -10px;
		border-left : 0;
		border-right: 10px solid #ffffff;
		border-top  : 5px solid transparent;
		border-bottom: 10px solid transparent;
	}
	.ayumi-whitebox.now .ayumi-whitebox-inner::after {
		content: "";
		display: inline-block;
		width : 4px;
		height: 92%;
		position: absolute;
		bottom: 0;
		left  : -35px;
		background: #f2f1ee;
	}
	.koukou,
	.jinsei,
	.hongkong,
	.kikoku,
	.now {
		top : 0;
		left: 0;
	}
	.now {
		width: 100%;
	}
	.list-mv01 img{
		transform: scale(0, 0);
		-webkit-transform: scale(0, 0);
		transition: .4s;
	}
	.mv01 img{
		transform: scale(1, 1);
		-webkit-transform: scale(1, 1);
	}
	.ayumi-whitebox .ayumi-whitebox-inner{
		transform: translate(40px,0);
		-webkit-transform: translate(40px,0);
		transition: .7s;
	}
	.ayumi-whitebox:nth-child(2n) .ayumi-whitebox-inner{
		transform: translate(40px,0);
		-webkit-transform: translate(40px,0);
	}
	.ayumi-whitebox .ayumi-whitebox-inner.mv05,
	.ayumi-whitebox:nth-child(2n) .ayumi-whitebox-inner.mv05{
		transform: translate(0,0);
		-webkit-transform: translate(0,0);
	}
	.now .h1-in-whitebox {
		text-align: left;
		font-size: 14px;
		font-weight: bold;
		margin-bottom: 6px;
	}
	.now .h2-in-whitebox {
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 12px;
		width: 100%;
		text-align: center;
	}
	.now .main-in-whitebox {
		display: block;
		width: 100%;
	}
	.now .text-in-whitebox {
		display: block;
		width: 100%;
		align-items: center;
	}
	.now .text-in-now {
		width: 100%;
	}
	.now .img-in-whitebox {
		display: block;
		width: 100%;
	}
	.now .img-in-whitebox:after {
		content:"";
		background: url(/yukitakahashi/wp/wp-content/uploads/2018/05/bear-1.png);
		background-size: 73px 88px;
		position: absolute;
		bottom: 20px;
		right: -12px;
	}

	/* プロフィール */
	h2 {
		margin : 30px 40px 14px;
		padding: 0 0 0 10px;
		font-size  : 16px;
		border-left: 4px solid #e4017f;
	}
	.profile-whitebox {
		margin : 0 40px 30px;
		padding: 25px 20px 38px;
	}
	.profile-whitebox .h1-in-whitebox{
		padding-left: 0;
	}
	.profile-whitebox.single .h1-in-whitebox,
	.profile-whitebox.double .h1-in-whitebox{
		padding-left: 17px;
	}
	.profile-whitebox .h1-in-whitebox {
		display: inline-block;
		font-size: 18px;
		margin-bottom: 0px;
	}
	.profile-whitebox .h1-in-whitebox.sp{
		display: block;
		font-size: 16px;
		margin-bottom: 16px;
	}
	.profile-whitebox .h1-in-whitebox.pc{ display: none;}
	.profile-whitebox .h2-in-whitebox.positionTitle {
		margin-top: 0;
		padding-bottom: 16px;
		font-size: 10px;
	}
	.profile-whitebox .text-in-whitebox {
		margin-top: 16px;
	}
	.profile-whitebox .h2-in-whitebox {
		border-bottom: 1px solid #aaaaaa;
		font-size: 13px;
		font-weight: bold;
		margin-top: 20px;
		padding-bottom: 0;
	}

	/* 経営者 */
	.profile-whitebox.single {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}
	.profile-whitebox.single > div {
		width: 100%;
	}

	/* 家事大学学長 */
	.sidebyside {
		margin: 0 40px 0;
		flex-wrap: wrap;
	}
	.sidebyside .profile-whitebox {
		width: 100%;
		min-width: 0;
		margin: 0 0 30px;
		padding: 40px 20px 40px 20px;
	}

	/* 公職 */
	.koshoku {
		justify-content: space-between;
		display: flex;
		flex-wrap: wrap;
		margin: 0 40px 44px;
	}
	.koshoku-contents {
		width: 100%;
	}
	.contents-top{
		border-bottom: none;
	}
	.koshoku-contents:nth-child(2) .contents-top{
		border-bottom: 1px solid #aaaaaa;
	}
	.koshoku .contents-left {
		padding-right: 0;
	}
	.koshoku .contents-right {
		padding-left : 0;
	}
	.contents-top,
	.contents-bottom{
		height: auto;
		line-height: 1.4;
		padding: 7px 0;
	}

	/* 関わる団体・プロジェクト */
	.project {
		display: flex;
		flex-wrap: wrap;
		margin: 0 40px 12px;
	}
	.project .project-contents{
		align-items: center;
	}
	.project .contents-right{
		padding-left: 0;
	}
	.project .project-img{
		width : 40px;
		height: 40px;
	}
	.project .project-img img{
		width : 100%;
		height: auto;
	}
	.project .project-text{
		font-size: 14px;
		margin: 0 0 0 10px;
		word-break: break-all;
		line-height: 1.4;
	}
	.links .link-item .text{
		font-size: 14px;
	}

	.translate img.sp{ display: inline-block;}
	.translate img.pc { display: none;}

}
