@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap');
@import url(https://fonts.googleapis.com/css?family=Pacifico);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans);

/* reset */
body,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;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}

body{
	font: 14px/1.9 'Kosugi Maru', 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	font-weight: 300;
	-webkit-text-size-adjust:100%;
	overflow-x: hidden;
	color: #000;
	background: #fff;
}

a{
	color: #0066ff;
	text-decoration: none;
}

a:hover, .active{
  text-decoration: underline;
}

a:active, a:focus,input:active, input:focus{outline:0;}


/* ヘッダー
------------------------------------------------------------*/
/*#header{
	position: relative;
    overflow:hidden;
    width:100%;
    height:852px;
	background-image: url(../images/top.png);
	background-repeat:no-repeat;
	background-size: 45%;
	background-position: 100% 70%;
}*/
video{
	z-index: 10;
	position: absolute;
	width: 100%;
	height: auto;
}
.video_end{
	animation: fadeOut 0.5s ease 1 normal;
	animation-fill-mode: forwards;
}
@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;display: none}
}
.movie_wrap{
	background-color: white;
	height: fit-content;
}

#page_top{
	width: 100px;
	height: 100px;
	position: fixed;
	right: 30px;
	bottom: 30px;
	background: #51b8db;
	border-radius: 50%;
	opacity: 0.6;

	color: #fff;
	line-height: 125px;
	text-decoration: none;

	text-align: center;
	font-size: 20px;
}

#page_top::before {
	/*font-family: 'Font Awesome 5 Free';
	font-weight: 900;*/
	content: '∧';
	font-size: 40px;
	color: #ffffff;
	position: absolute;
	width: 50px;
	height: 165px;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
}

@media screen and (max-width: 576px) {
	#page_top{
		width: 60px;
		height: 60px;
		right: 20px;
		bottom: 20px;
		line-height: 75px;
		font-size: 12px;
	}
	#page_top::before {
		font-size: 20px;
		width: 50px;
		height: 100px;
	}
}
#header{
	position: relative;
	overflow:hidden;
	width:100%;
	/*height:852px;
	height: calc(100vh - 215px);*/
	/*height: calc(100vw*0.5625 - 142px);*/
	/*height: calc(100vw*0.65 - 142px);*/
	height: 900px;

	background-repeat:no-repeat;
	/*background-size: 100%;
	background-position: 100% 100%;
	*/

	background-size: auto auto;
	background-position: center 100%;
}
#header.header_image{
	background-image: url(../images/top.jpg);
}

#header_other{
	margin-top: 190px;

	height: 800px;

	background-image: url(../images/top.jpg);
	background-repeat:no-repeat;
	background-size: auto auto;
	background-position: center 100%;

}

@media screen and (max-width: 1200px){
	#header {
		/*height: calc(100vh - 150px);*/
		/*height: calc(100vw*0.5625 - 72px);*/

	}
}
@media screen and (max-width: 840px){
	#header {
		/*height: calc(100vh - 150px);*/
		/*height: calc(100vw*0.5625 - 12px);*/

		/*height:300px;*/
		min-height: 200px;
		background-image: url(../images/top_sp.jpg);
	}

	#header.header_image{
		background-image: url(../images/top_sp.jpg);
	}

	video{
		display: none;
	}

	#header_other{
		margin-top: 50px;

		height: 550px;

		background-image: url(../images/top_sp.jpg);
	}
}
@media screen and (max-width: 576px){
	#header {
		height: 520px;

		background-size: 576px;
		background-image: url(../images/top_sp.jpg);

	}

	.movie_wrap{
		background-color: white;
		height: fit-content;
		min-height: 200px;
		min-height: 0 !important;
	}
	.movie_wrap_end{
		min-height: 0 !important;
	}

	#header.header_image{
		background-size: 576px;
	}

	#header_other{
		background-size: 576px;
		height: 390px;
	}

}

#header img{
    position:absolute;
    width:1920px;
    height:852px;
}

#slogan{
	position: absolute;
  	top: 50%;
	width: 900px;
	/*
	-webkit-transform: translate(-20%, -75%);
  	transform: translate(-20%, -75%);
  	 */
  	-webkit-transform: translate(-40%, -55%);
  	transform: translate(-40%, -55%);

	color: #000;
	line-height: 1.75;
	text-align: left;
	font-size: 2.0rem;
	/*right:0;*/
	left:50%;
}
#slogan span{
	color: #10b6df;
}

#slogan .slogan_slide{
	height: 350px;
	background-image: url(../images/top_slide_pc_01.png);
	background-repeat: no-repeat;

	/*アニメ―ション設定指定
	animation-name:fadeInAnime;
	/*長さ12秒
	animation-duration:12s;
	animation-fill-mode:forwards;
	/*ループ指定
	animation-iteration-count:infinite;

	/*開始遅延 0.5秒
	animation-delay: 500ms;

	opacity:0;*/
	margin-top: 10px;
}

/*PC用スライドアニメーション*/
@keyframes fadeInAnime{

	0% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_01.png);
	}

	5% {
		opacity: 1;
	}

	28.2% {
		opacity: 1;
	}

	33.2% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_01.png);
	}

	33.3% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_02.png);
	}

	38.2% {
		opacity: 1;
	}

	61.5% {
		opacity: 1;
	}

	66.5% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_02.png);
	}

	66.6% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_03.png);
	}

	71.6% {
		opacity: 1;
	}

	94.5% {
		opacity: 1;
	}

	99.9% {
		opacity: 0;
		background-image: url(../images/top_slide_pc_03.png);
	}
}

/*SP、Tab用スライドアニメーション*/
@media screen and (max-width: 1000px) {
	#slogan .slogan_slide{
		height: 350px;
		background-image: url(../images/top_slide_sp_01.png);
		background-repeat: no-repeat;
	
		/*アニメ―ション設定指定
		animation-name:fadeInAnime;
		/*長さ12秒
		animation-duration:12s;
		animation-fill-mode:forwards;
		/*ループ指定
		animation-iteration-count:infinite;
	
		/*開始遅延 0.5秒
		animation-delay: 500ms;
	
		opacity:0;*/
		margin-top: 10px;
	}
	@keyframes fadeInAnime{
		0% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_01.png);
		}

		5% {
			opacity: 1;
		}

		28.2% {
			opacity: 1;
		}

		33.2% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_01.png);
		}

		33.3% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_02.png);
		}

		38.2% {
			opacity: 1;
		}

		61.5% {
			opacity: 1;
		}

		66.5% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_02.png);
		}

		66.6% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_03.png);
		}

		71.6% {
			opacity: 1;
		}

		94.5% {
			opacity: 1;
		}

		99.9% {
			opacity: 0;
			background-image: url(../images/top_slide_sp_03.png);
		}
	}
}


#header img.logo_txt,
#header img.logo {
	opacity: 0;
}


#slogan h1{
	font-size: 40px;
	font-family: 'Pacifico', cursive;
	margin-bottom: 20px;
	font-weight:normal;
}

#slogan h2{
	font-size: 20px;
	font-weight:normal;
}
@media screen and (max-width: 1200px)
{
	#slogan{

		/*
		-webkit-transform: translate(-20%, -100%);
		transform: translate(-20%, -100%);
		*/
		-webkit-transform: translate(-40%, -55%);
		transform: translate(-40%, -55%);
		font-size: 1.5rem;
	}
	#slogan .slogan_slide{
		background-size: 750px;
	}
}

@media screen and (max-width: 1000px)
{
	#slogan{

		font-size: 1.4rem;
	}

	#slogan .slogan_slide{
		background-size: 600px;
	}
}

@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	#slogan{
		-webkit-transform: translate(5%, -100%);
		transform: translate(5%, -100%);
		left:0;

		font-size: 1.3rem;
	}

	#slogan .slogan_slide{
		margin-left: 1rem;
		background-size: 550px;
	}

}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */

	#slogan{

		/**/
		-webkit-transform: translate(2%, -60%);
		transform: translate(2%, -60%);


		font-size: 1.0rem;
	}

	#slogan .slogan_slide{

		background-size: 320px;
	}

}


.menuBtn{

	position: relative;/*ボタン内側の基点となるためrelativeを指定*/
	background: #fff;
	cursor: pointer;
	width: 50px;
	height:50px;
	border-radius: 5px;
	margin-right: 0;
	margin-left: auto;
}

/*ボタン内側*/
.logo_menu{
	float :left;
}
.logo_menu img{
	height: 50px;
	width: auto;
	margin-left: 1rem;
}
@media screen and (max-width: 576px) {
	.logo_menu img{
		height: 40px;
		margin-left: 0;
		margin-top: 5px;
	}
}


.menuBtn span{
	display: inline-block;
	transition: all .4s;/*アニメーションの設定*/
	position: absolute;
	left: 14px;
	height: 2px;
	border-radius: 5px;
	background: #000;
	width: 45%;
}


.menuBtn span:nth-of-type(1) {
	top:13px;
}

.menuBtn span:nth-of-type(2) {
	top:19px;
}

.menuBtn span:nth-of-type(3) {
	top:25px;
}

.menuBtn span:nth-of-type(3)::after {
	content:"Menu";/*3つ目の要素のafterにMenu表示を指定*/
	position: absolute;
	top:5px;
	left:1px;
	color: #000;
	font-size: 0.6rem;
	text-transform: uppercase;
}

.menuBtn.close span:nth-of-type(1) {
	top: 14px;
	left: 18px;
	transform: translateY(6px) rotate(-45deg);
	width: 30%;
}

.menuBtn.close span:nth-of-type(2) {
	opacity: 0;
}

.menuBtn.close span:nth-of-type(3){
	top: 26px;
	left: 18px;
	transform: translateY(-6px) rotate(45deg);
	width: 30%;
}

.menuBtn.close span:nth-of-type(3)::after {
	content:"Close";/*3つ目の要素のafterにClose表示を指定*/
	transform: translateY(0) rotate(-45deg);
	top:5px;
	left:4px;
}

/* フッター
------------------------------------------------------------*/
#footer{
	clear: both;
	padding: 50px 10px 50px 0;
	text-align: center;
	font-size: 12px;
}


/* 共通
------------------------------------------------------------*/
h1, h2{
	font-family: 'Josefin Sans', 'Noto Sans JP',serif;
}

img{
	width: 100%;
	height: auto;
}

section{
	clear:both;
}


section h2{
	font-size: 22px;
	font-weight:normal;
	text-align: center;
	margin-top: 2rem;
}

.inner{
	width: 94%;
	margin: 0 auto;
	padding-bottom: 50px;
}

.col2 li{
	display: inline-block;
	width: 100%;
  	margin: 20px 0 20px 0;
}


/* SEC00 GREETING
------------------------------------------------------------*/

.outer_rinen_section {
	margin-top: 3rem;
    background: #e7f9ff;
}

.inner_rinen_section {
    background-image: url(../images/philosophy.png);
    background-size: cover;
    background-position: 50% 0%;
    padding: 5rem 0 9rem;
}

.rinen_section {
    line-height: 1.8;
    box-sizing: content-box;
    padding: 0 1rem 0rem 5rem;
    margin: 0 auto;
    max-width: 1400px;
    position: relative;
}

.rinen_section .box1 {
    background: #fff;
    padding: 3rem;
    z-index: 1000;
    width: 42%;
    box-shadow: 120px 120px 0 -50px #e7f9ff;
}

.rinen_section .box1 h5 {
    color: #5b7352;
}

.rinen_section .box1 h4 {
    margin-bottom: 0.6rem;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-weight: 300;
    font-size: 2.6rem;
}

.rinen_section p {
    width: 100%;
    text-align: justify;
}

.rinen_section p span {
    display: block;
    text-align: right;
}

/* SEC01 VISION
------------------------------------------------------------*/

#sec01{
	margin-top: 200px;
	height: 900px;

	background-image: url(../images/about.png);
	background-size:contain;
	background-position: center;
	background-repeat:no-repeat;
}

#sec01.simple{
	background-image: none;
	height: initial;
}



.head{
	width: 1440px;
	margin-right: auto;
	margin-left: auto;
}
.head h2{
	font-family:  'Hammersmith One', 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;

	color: #acacac;
	font-size: 8rem;
	letter-spacing: 1.0rem;
	line-height: 6rem;
	/*font-weight: bold;*/
	text-align: left;
}
.head p{
	font-size: 2.5rem;
	text-align: left
}


@media screen and (max-width: 1200px)
{
	.head{
		width: 800px;
	}
}
@media screen and (max-width: 840px)
{
	.head{
		width: 90%;
		padding-left: 1rem;
	}
	.head h2{
		font-size: 3.5rem;
		letter-spacing: 0.25rem;
		line-height: 3.0rem;
	}
	.head p {
		font-size: 1.0rem;
	}
}

#sec01 .vision{
	/*width: 1200px;*/
	width: 950px;
	margin: 0 auto;
	/*font-size: 1.5rem;*/
	font-size: 1.2rem;
	z-index: 5;
	/*line-height: 5.0rem;*/
	line-height: 4.0rem;
	padding-top: 75px;
}

#sec01.simple .vision{
	padding-top: 0;
}

#sec01 .vision p{
	/*position: absolute;*/
	width: inherit;
}
#sec01.simple .vision p.explain{
	display: none;
}

#sec01 .line
{
	display:flex;
	align-items: center;
	justify-content: space-evenly;

	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 0 ;
}

#sec01 .triangle_line
{
	position: relative;
	width: 0;
	height: 0;
	border-bottom: 433px solid #10b6df;
	border-left: 250px solid transparent;
	border-right: 250px solid transparent;
	z-index: 0 ;
}

#sec01 .triangle_line_sub
{
	position: absolute;
	top:5px;
	left:-246px;
	border-bottom: 425px solid white;
	border-left: 246px solid transparent;
	border-right: 246px solid transparent;
	z-index: 0 ;
}

#sec01 .more {
	width: 120px;
	height: 120px;
	line-height: 120px;
	border-radius: 50%;
	background-color: #10b6df;
	text-align: center;
	position: relative;
	left: 180px;
	top: 370px;
	font-weight: bold;
	font-size: 1.5rem;
	z-index: 6;
	font-family: 'Noto Sans JP', serif;
}
#sec01 .more .link_more{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#sec01 .more:hover{
	transition: 0.2s;
	background-color: #E7F9FF;
}

.more2{
	font-family:'Hammersmith One', 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	margin-right: 0;
	margin-left: auto;
	width: fit-content;
	text-align: right;
	font-size: 0;
	line-height: 0;
	position: relative;
	margin-top: 8rem;
}

#sec01.simple .more2{
	margin-top: 0;
}

.more2:hover{
	opacity: 0.4;
}
.more2 p{
	display:inline-block;
	vertical-align:top;

	font-size: 3rem;
	letter-spacing: 0.5rem;
	line-height: 6rem;
}

.more2 img{
	width: auto;
}
.more2 a{
	 display: block;
	 position: absolute;
	 top: 0;
	 left: 0;
	 width: 100%;
	 height: 100%;
}

@media screen and (max-width: 1200px)
{
	#sec01 .vision{
		width: 800px;
		font-size: 1.1rem;
		line-height: 2.0rem;
	}
}
@media screen and (max-width: 1000px)
{
	#sec01 .vision{
		width: 600px;
	}
}

@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	#sec01 {
		margin-top: 4rem;
		background-size: 60%;
		/*background-position: 120px 0px;*/
		background-position: 50% 80%;
		height: 460px;
	}

	#sec01 .vision{
		width: 480px;
		padding-top: 2rem;
	}
	#sec01 .vision p{
		font-size: 1rem;
	}
	#sec01 .triangle_line
	{
		top:200px;
		border-bottom: 346px solid #10b6df;
		border-left: 200px solid transparent;
		border-right: 200px solid transparent;
	}

	#sec01 .triangle_line_sub
	{
		top:5px;
		left:-196px;
		border-bottom: 338px solid white;
		border-left: 196px solid transparent;
		border-right: 196px solid transparent;
	}

	#sec01 .more{
		width:96px;
		height:96px;
		line-height: 96px;
		border-radius:50% ;
		left: 144px;
		top: 296px;
		font-size: 1.2rem;
	}
	.more2  {
		margin-top: 2rem;
	}

	.more2 p {
		font-size: 1.4rem !important;
		line-height: 3.2rem;
		letter-spacing: 0.4rem;
	}
	.more2 img {
		width: 90px !important;
	}

}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */
	#sec01 {
		margin-top: 4rem;
		background-size: 120%;
		background-position: 20px 80px;
		height: 720px;
	}

	#sec01 .vision{
		width: 300px;
		padding-top: 2rem;
	}

	#sec01 .vision p{
		font-size: 0.9rem;
	}

	#sec01 .triangle_line
	{
		top:400px;
		border-bottom: 208px solid #10b6df;
		border-left: 120px solid transparent;
		border-right: 120px solid transparent;
	}

	#sec01 .triangle_line_sub
	{
		top:5px;
		left:-116px;
		border-bottom: 200px solid white;
		border-left: 116px solid transparent;
		border-right: 116px solid transparent;
	}

	#sec01 .more{
		width:57px;
		height:57px;
		line-height: 57px;
		border-radius:50% ;
		left: 90px;
		top: 175px;
		font-size: 0.8rem;
	}
}

/* SEC02 MESSAGE
------------------------------------------------------------*/
#sec02{
	margin: 18rem auto 100px auto;
}
.business_contents{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;

	width: 950px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
}

.business_contents .content_box{
	width: 200px;

}
.business_contents .content_box .image{
	width: 180px;
	height: 180px;
	border-radius: 50%;
	border-style: solid;
	border-width: 3px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
}
.business_contents .content_box .pink{
	/*border-color: #f5b0bc;*/
	border-color: #94d4ea;
	background-color: #94d4ea;
}

.business_contents .content_box .blue{
	/*border-color: #94d4ea;*/
	border-color: #f5b0bc;
	background-color: #f5b0bc;
}

.business_contents .content_box .image a{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.business_contents .content_box .image img{
	width: 80%;
	height: auto;

	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	pointer-events: none;
}

.business_contents .content_box h4{
	font-size: 1.1rem;
	margin-top: 1.5rem;
	margin-bottom: 0.8rem;
	text-align: center;
	letter-spacing: 0.15rem;
}
.business_contents .content_box ul{
	margin-left: 1.25rem;
	width: 90%;
}
.business_contents .content_box li{
	list-style: initial;
}

.business_contents .content_box p{
	font-size: 0.8rem;
	/*
	line-height: 1.25;
	 */
	line-height: 1.75;
	text-align: left;
	width: 80%;
	margin-left: auto;
	margin-right: auto;

}

@media screen and (max-width: 960px) {
	/* 840px以下に適用されるCSS（タブレット用） */

	.business_contents{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-around;

		width: 810px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}
}

@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	#sec02{
		margin-top: 5rem;
	}

	.business_contents{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-around;

		width: 580px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}

	.business_contents .content_box{
		width: 200px;
		margin-bottom: 2rem;

	}
}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */
	#sec02{
		margin-top: 7rem;
	}

	.business_contents{
		display:block;
		flex-wrap: nowrap;
		justify-content: space-around;

		width: 320px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}
	.business_contents .content_box{
		width: 100%;
		margin-bottom: 2rem;
		margin-left: auto;
		margin-right: auto;
	}

	.business_contents .content_box h4{
		font-size: 1.1rem;
		margin-top: 1.1rem;
		margin-bottom: 0.4rem;
		text-align: center;
	}

	.business_contents .content_box p{
		font-size: 1.0rem;
	}

	.business_contents .content_box ul{
		width: 80%;
	}
	.business_contents .content_box li{
		list-style: inside;
	}
}

/*　no use*/
.wrap{
	clear: both;
	width: 100%;
	background: #f6f6f6;
}

.bg{
	line-height: 0;
}

.txt h2{
	padding: 0 0 20px !important;
}


/* SEC03 SERVICE MESSAGE STORY
------------------------------------------------------------*/

#sec03{
	margin-top: 22rem;
	margin-bottom: 8rem;
	width: 100%;
}
#sec03 h2{
	color: #787878;
}
.back_grey{
	position: absolute;
	background-color: #f2f2f2;
	height: 850px;
	width: 100%;
	z-index: -1;

	/*transform:translateX(-40px) translateY(-80px) rotate(5deg)*/;
	transform:translateY(-80px);

	-webkit-clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);
	clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);

}

.officer_contents{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;

	width: 950px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5rem;
}
.officer_contents .content_box{
	width: 48%;
}
.officer_contents .profile p{
	line-height: 1.5;
	font-size: 1.0rem;

	display:inline-block;
	vertical-align:top;
	padding-top: 2rem;


	white-space: nowrap;

}
.officer_contents .profile span{
	/*font-size: 3.0rem;*/
	font-size: 2.0rem;

	line-height: 6rem;
}

.officer_contents .profile img{
	width: 45%;
	height: auto;
}

.officer_contents .more{
	width: fit-content;
	text-align: center;
	margin-top: 2rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1rem;
	padding-right: 1rem;
	font-size: 1.1rem;
	font-weight: bold;
	border-bottom: 1px solid black;
}
.officer_contents .more a{
	color: black;
	text-decoration: none;
}

.officer_contents .more a:hover{
	opacity: 0.5;
	transition: 0.2s;
}
@media screen and (max-width: 1280px){
	.officer_contents {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 800px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 5rem;
	}

	.back_grey{
		height: 980px;

		-webkit-clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);
		clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 92%);
	}
}

@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	#sec03{
		margin-top: 12rem;
	}
	.officer_contents{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-around;

		width: 580px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}
	.officer_contents .content_box {
		width: 100%;
	}
	.officer_contents .content_box:first-child{
		margin-bottom: 2rem;
	}
	.officer_contents .profile img {
		width: 45%;
		height: auto;
	}
	.officer_contents .profile span {
		font-size: 2.25rem;
		letter-spacing: 0.25rem;
		line-height: 4rem;
	}
	.back_grey{
		height: 900px;

		-webkit-clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
		clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
	}

}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */


	.officer_contents{
		display:block;
		flex-wrap: wrap;
		justify-content: space-around;

		width: 260px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}

	.officer_contents .content_box{
		margin-bottom: 5rem !important;

	}
	.officer_contents .profile img {
		width: 100%;
		height: auto;
	}

	.back_grey{
		height: 1350px;

		-webkit-clip-path: polygon(0 0, 100% 3%, 100% 100%, 0 97%);
		clip-path: polygon(0 0, 100% 3%, 100% 100%, 0 97%);
	}
}

#sec04{
	margin-top: 10rem;
}

.flow_unit{
	/*width:750px;*/
	width:1020px;

	margin-right: auto;
	margin-left: auto;

}
.flow_unit:before,
.flow_unit:after {
	content:"";
	display:table
}
.flow_unit:after{
	clear: both;
}

.flow_unit .number{
	float: left;
	font-size: 5rem;
	/*font-weight: bold;*/
	position: relative;
	/*font-family: 'Noto Sans JP',serif;*/
}
.flow_unit .number div{
	position: absolute;
	z-index: -1;
}

.flow_unit .number_1 div{
	border-radius: 50%;
	width: 80px;
	height: 80px;
	left: 20px;
	top: 70px;
	background-color: #f8c4cc;
}

.flow_unit .number_2 div{
	transform:rotate(20deg);
	width: 70px;
	height: 70px;
	left: -5px;
	top: 55px;
	background-color: #94d4ea;
}

.flow_unit .number_3 div{
	border-bottom: 69px solid #0092d2;
	border-left: 40px solid transparent;
	border-right: 40px solid transparent;
	top: 30px;
	transform:rotate(20deg);
}



.flow_unit .number_4 div{
	transform:rotate(-20deg);
	width: 60px;
	height: 60px;
	left: 5px;
	top: 40px;
	background-color: #f8c4cc;
}

.ml-30px{
	margin-left: 30px;
}

.flow_unit .flow{
	font-size: 3rem;
	line-height: 9rem;
	padding-left: 6.5rem;
	float: none;
}

.flow_unit .content2{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

}
.flow_unit .content2 .pic{
	width: 50%;
}

.flow_unit .content2 .flow-pic_1{
	width: 40%;
}

.flow_unit .content2 .explain{
	width: 50%;

}

.flow_unit .content2 .explain_1{
	margin-top: 0.5rem;

}

.flow_unit .content2 .flow-pic_2a{
	width: 45%;
}
.flow_unit .content2 .flow-pic_2a img{
	width: 85%;
}

.flow_unit .content2 .explain_2{
	width: 55%;

}

.flow_unit .content2 .explain_3{
	margin-top: 2rem;

}

.flow_unit .content2 .flow-pic_4a{
	width: 45%;
}
.flow_unit .content2 .flow-pic_4a img{
	width: 85%;
}

.flow_unit .content2 .explain_4{
	margin-top: 2rem;

}

.flow_unit .content .pic{
	width: 200px;
	float: left;
	margin-right: 20px;
	position: relative;
	height: 150px;
}

.flow-pic_1 img{
	width: 90%;
	top: 0px;
}

.flow_unit .content .flow-pic_2a,
.flow_unit .content .flow-pic_4a{
	float: right;
}

.flow_unit .content2 .flow-pic_2a,
.flow_unit .content2 .flow-pic_4a{
	order: 1;
}

.flow_unit .content2 .flow-pic_4a{
	order: 1;
}

.flow-pic_2a img{
	top:-70px;
	left:40px;
	width: 110%;
}

.flow-pic_3 img{
	width: 60%;
	margin-left: 4rem;
}

.flow-pic_4a img{
	top:-60px;
	left: 40px;
	width: 175%;
}

.flow_unit .content .pic img{
	position: absolute;
}
.flow_unit .content p,
.flow_unit .content2 p{
	float: left;
	font-size: 1.0rem;
	line-height: 3rem;
	letter-spacing: 0.35rem;
}
.add_text{
	width: 900px;
	margin: 0 auto;
	z-index: 5;
	padding-top: 75px;
}
.add_text h4{
	font-size: 2.2rem;
	line-height: 4.0rem;
	letter-spacing: 0.5rem;
	margin-bottom: 4rem;
}
.add_text ul{
	list-style: inside;
	margin-left: 1rem;
}
.add_text li{
	font-size: 1.2rem;
	line-height: 4.0rem;
}
.add_text h5{
	font-size: 1.5rem;
	letter-spacing: 0.5rem;
	margin-top: 4rem;
	line-height: 4.0rem;
}
.back_grey2 {
	padding-top: 200px;
	margin-top: 200px;

	padding-bottom: 300px;
	margin-bottom: 200px;


	background-color: #f2f2f2;
	transform: translateY(-19px);
	-webkit-clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);
	clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);
}

@media screen and (max-width: 1280px){
	.flow_unit {
		width: 750px;
		margin-right: auto;
		margin-left: auto;
	}
	.flow_unit .content2 .explain {
		width: 60%;
	}
	.flow_unit .content2 .pic {
		width: 40%;

	}
	.flow_unit .content2 p {
		font-size: 1.0rem;
		line-height: 2.0rem;
		letter-spacing: 0.1rem;
	}
}
@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	.flow_unit{
		width: 460px;
		margin-right: auto;
		margin-left: auto;

	}
	.flow_unit .content{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		clear: both;
	}

	.flow_unit .content2{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		clear: both;
	}

	.flow_unit .number {
		float: left;
		font-size: 4rem;
		/* font-weight: bold; */
		position: relative;
	}
	.flow_unit .flow {
		font-size: 2.5rem;
		line-height: 7rem;
		padding-left: 6.5rem;
		float: none;
	}

	.flow_unit .number_1 div {
		border-radius: 50%;
		width: 60px;
		height: 60px;
		left: 20px;
		top: 50px;
		background-color: #f8c4cc;
	}

	.flow_unit .number_2 div {
		transform: rotate(20deg);
		width: 52px;
		height: 52px;
		left: 15px;
		top: 52px;
		background-color: #94d4ea;
	}

	.flow_unit .number_3 div {
		border-bottom: 52px solid #0092d2;
		border-left: 30px solid transparent;
		border-right: 30px solid transparent;
		top: 26px;
		left: 8px;
		transform: rotate(20deg);
	}

	.flow_unit .number_4 div {
		transform: rotate(-20deg);
		width: 52px;
		height: 52px;
		left: 16px;
		top: 50px;
		background-color: #f8c4cc;
	}

	.flow_unit .content2 .pic {
		width: 100%;
		text-align: center;
	}


	.flow_unit .content2 .pic img{
		width: 55%;
		height: auto;
	}


	.flow_unit .content2 .explain {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 2rem;
		margin-top: 0 !important;
	}


	.flow_unit .content .pic {
		width: 45%;
	}

	.flow_unit .content .flow-pic_1 {
		width: 38%;
		margin-right: 0;
	}

	.flow_unit .content .flow-pic_2a{
		float: right;
		width: 40%;
		margin-right: 0;
		order: 1;
	}

	.ml-30px{
		margin-left: 0;
	}

	.flow_unit .content .flow-pic_3 {
		width: 40%;
		margin-right: 0;
	}

	.flow_unit .content .flow-pic_4a {
		float: right;
		width: 40%;
		margin-right: 0;
		order: 1;
	}

	.flow-pic_2a img {
		top: -70px;
		left: -15px;
		width: 110%;
	}

	.flow-pic_3 img {
		margin-left: 20px;

	}

	.flow-pic_4a img {
		top: -60px;
		left: -40px;
		width: 120%;
	}

	.flow_unit .content p {
		width: 60%;
		font-size: 1.0rem;
	}

	.flow_unit .content .flow-pic_1+p {
		width: 62%;
	}
	.flow_unit .content .flow-pic_3+p {
		width: 60%;
	}

	.flow_unit .content2 .flow-pic_2a,
	.flow_unit .content2 .flow-pic_4a {
		order: 0;
	}

	.flow_unit .content2 p {
		font-size: 0.9rem;
		line-height: 1.5rem;
		letter-spacing: 0.1rem;
	}


	.add_text{
		width: 100%;
		margin: 0 auto;
		z-index: 5;
		padding-top: 75px;
	}
	.add_text h4{
		width:90%;
		font-size: 2.2rem;
		line-height: 4.0rem;
		letter-spacing: 0.5rem;
		margin-bottom: 3rem;
		margin-left: 2rem;
	}
	.add_text ul{
		width: 80%;
		list-style: inside;
		margin-left: 4rem;

	}
	.add_text li{
		font-size: 1.0rem;
		line-height: 3.0rem;
	}
	.add_text h5{
		width:80%;
		font-size: 1.5rem;
		letter-spacing: 0.3rem;
		margin-top: 4rem;
		line-height: 3.0rem;
		margin-left: 2rem;


	}
	.back_grey2 {
		padding-top: 100px;
		margin-top: 100px;

		padding-bottom: 200px;
		margin-bottom: 100px;


		background-color: #f2f2f2;
		transform: translateY(-19px);
		-webkit-clip-path: polygon(0 0, 100% 7%, 100% 100%, 0 93%);
		clip-path: polygon(0 0, 100% 7%, 100% 100%, 0 93%);
	}


}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */
	.flow_unit{
		width: 350px;
		margin-right: auto;
		margin-left: auto;
		max-width: 100%;

	}

	.flow_unit .number {
		float: left;
		font-size: 3rem;
		/* font-weight: bold; */
		position: relative;
	}
	.flow_unit .number div{
		z-index: -1;
	}


	.flow_unit .number_1 div {
		border-radius: 50%;
		width: 45px;
		height: 45px;
		left: 15px;
		top: 45px;
		background-color: #f8c4cc;
	}

	.flow_unit .number_2 div {
		transform: rotate(20deg);
		width: 39px;
		height: 39px;
		left: 15px;
		top: 39px;
		background-color: #94d4ea;
	}

	.flow_unit .number_3 div {
		border-bottom: 38px solid #0092d2;
		border-left: 22px solid transparent;
		border-right: 22px solid transparent;
		top: 25px;
		left: 8px;
		transform: rotate(20deg);
	}

	.flow_unit .number_4 div {
		transform: rotate(-20deg);
		width: 39px;
		height: 39px;
		left: 12px;
		top: 38px;
		background-color: #f8c4cc;
	}

	.flow_unit .flow {
		font-size: 1.5rem;
		line-height: 5rem;
		padding-left: 4.5rem;
		float: none;
	}

	.flow_unit .pic img {
		z-index: -3;
	}

	.flow_unit .content {
		display: block;
		flex-wrap: wrap;
		justify-content: space-between;
		clear: both;
	}

	.flow_unit .content .flow-pic_1 {
		float: left;
		width: 100%;
		height: auto;
		text-align: center
	}

	.flow_unit .content .flow-pic_1 img{
		position: relative;
		width: 80%;
	}

	.flow_unit .content .flow-pic_2a {
		float: left;
		width: 100%;
		height: 220px;
	}

	.flow_unit .content .flow-pic_2a img{
		position: relative;
		width: 100%;
		top: -40px;
		left: 0;
		z-index: -3;
	}

	.flow_unit .content .flow-pic_2a+p {
		top:-20px;
	}

	.flow_unit .content .flow-pic_3 {
		float: left;
		width: 100%;
		height: 155px;
		text-align: center

	}

	.flow_unit .content .flow-pic_3 img{
		position: relative;
		width: 60%;
		margin-left: auto;
		margin-right: auto;
	}

	.flow_unit .content .flow-pic_4a {
		float: left;
		width: 100%;
		height: 170px;
	}

	.flow_unit .content .flow-pic_4a img{
		position: relative;
		width: 100%;
		top: -40px;
		left: 0;
		z-index: -3;
	}

	.flow_unit .content .flow-pic_4a+p {
		top:-20px;
	}

	.flow_unit .content p {
		float: left;
		width: 100% !important;
		font-size: 0.9rem;
	}

	.flow_unit .content2 .explain {
		width: 75%;
	}

	.flow_unit .content2 .pic img{
		width: 70%;
	}

	.back_grey2{
		clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
		margin-top: 50px;
		padding-top: 75px;
		margin-bottom: 0px;
		padding-bottom: 100px;


	}

	.add_text{
		width: 100%;
	}

	.add_text h4{
		width: 90%;
		line-height: 3.0rem;

		/*
		font-size: 1.8rem;
		letter-spacing: 0.5rem;
		*/
		font-size: 1.6rem;
		letter-spacing: 0.25rem;

		margin-bottom: 2rem;
		margin-left: 1rem;
	}

	.add_text ul{
		width: 75%;
		margin-left: 2.5rem;

	}
	.add_text li{
		font-size: 0.9rem;
		line-height: 2rem;

	}
	.add_text h5 {
		width: 90%;
		/*font-size: 1.5rem;*/
		font-size: 1.3rem;
		letter-spacing: 0.1rem;
		margin-top: 4rem;
		line-height: 2.5rem;
		margin-left: 1rem;
	}

}

/* no-use */
.col3 li{
	margin-bottom: 50px;
}

.col3 img{
	max-width: 288px;
	display: block;
	margin: -5px auto 20px;
}


/* SEC04 STORY & SUCCESS
------------------------------------------------------------*/
#sec05{
	margin-top: 170px;
}

#sec05 dl{
	line-height: 1.2;
}

#sec05 dt{
	clear: left;
	float: left;
	display: block;
	width: 30%;
	margin-right: 10%;
	margin-bottom: 20px;
	text-align: right;
	line-height: 1.6em;
}

#sec05 dd{
	width: 60%;
	float: left;
	text-align: left;
	margin-bottom: 15px;
	line-height: 1.6em;
}

#sec05 header{
	display: none;
}

.tel_contact{
	width: 750px;
	font-size: 0;
	margin-bottom: 12rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.mail_contact{
	width: 950px;
	font-size: 0;
	margin-bottom: 4rem;
	text-align: center;
}

.tel_contact p,
.mail_contact p{
	display: inline-block;
	vertical-align:top;
	font-size: 2.0rem;
	line-height: 100px;
}
.tel_contact p{
	letter-spacing: 0.6rem;
}
.tel_contact img,
.mail_contact img{
	width: 100px;
	height: auto;
}
.tel_contact p.number{
	display: block;
	font-size: 5rem;
	line-height: 10rem;
	/*letter-spacing: 0.25rem;*/
	letter-spacing: 0.6rem;
}
.tel_contact .time{
	font-size: 1.25rem;
	background-color: #e4e4e4;
	border-radius: 1.5rem;
	width: fit-content;
	/*
	padding-left: 7rem;
	padding-right: 7rem;
	*/
	padding-left: 10rem;
	padding-right: 10rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	margin-left: auto;
	margin-right: auto;
}

.form_box{
	width:950px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 3rem;

}

.form_box table{
	margin-right: auto;
	margin-left: auto;
}

.form_box form{
	margin: 0 auto 10rem;
	/*width: 100%;*/
	width: 950px;
	text-align: center;
	border-collapse: collapse;
	border-spacing: 0 10px;
}

.form_box form tr{
	border-bottom: 1px solid #e9e9e9;
}

.form_box form tr:first-child{
	border-top: 1px solid #e9e9e9;
}

.form_box form th{
	vertical-align: top;
	/*width: 34%;*/
	width: 24%;
	padding: 1rem;
	text-align: left;
	position: relative;
	font-weight: bold;
	line-height: 2.5;
}
.form_box form .required{
	margin-left: 0;
	/*margin-right: 4px;*/
	margin-right: 10px;
	margin-top: 2px;
	color: #fff;
	font-size: 0.8rem;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	background: #f5b0bc;
	/*padding: 2px 6px;*/
	padding: 3px 9px;
	right: 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	font-weight: normal;
}

.form_box form td {
	/*width: 66%;*/
	width: 76%;
	padding: 1rem 1rem;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-align: left;
}


.form_box form input[type=text],
.form_box form input[type=email],
.form_box form input[type=tel],
.form_box form select,
.form_box form textarea {
	width: 100%;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

.form_box form input:required,
.form_box form select:required,
.form_box form textarea:required {
	background-color: #ebedf3;
}

.form_box form input:valid,
.form_box form select:valid,
.form_box form textarea:valid {
	background-color: #fff;
}

.form_box form .link_btn{
	text-align: center;
}
.form_box form #submit{
	padding: 0.8rem;
	font-size: 0.9rem;
	font-weight: bold;
	width: 30%;
	margin: 1rem auto 0;
	border: 2px #f5b0bc solid;
	background: #f5b0bc;
	color: #fff;
	display: block;
	border-radius: 8px;
}

.form_box form #submit:hover{
	opacity: 0.5;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

@media screen and (max-width: 1280px){
	.tel_contact p,
	.mail_contact p{
		font-size: 1.5rem;
		line-height: 75px;
	}
	.tel_contact img,
	.mail_contact img{
		width: 75px;
		height: auto;
	}

	.tel_contact p.number {
		font-size: 3.5rem;
		line-height: 7rem;
		letter-spacing: 0.25rem;
	}
	.tel_contact .time {
		font-size: 1.1rem;
		/*border-radius: 1rem;*/
		padding-left: 5rem;
		padding-right: 5rem;
	}
}

@media screen and (max-width: 840px) {
	/* 840px以下に適用されるCSS（タブレット用） */
	#sec05{
		margin-top: 5rem;
	}

	.form_box{
		width:550px;
		margin-right: auto;
		margin-left: auto;
		margin-top: 3rem;

	}

	.tel_contact p,
	.mail_contact p{
		font-size: 1.0rem;
		line-height: 50px;
	}
	.tel_contact img,
	.mail_contact img{
		width: 50px;
		height: auto;
	}

	.tel_contact {
		margin-bottom: 4rem;
		width: 100%;
	}

	.tel_contact p{
		letter-spacing: 0;
	}

	.mail_contact {
		width: 100%;
		margin-bottom: 2rem;
	}

	.tel_contact p.number {
		font-size: 2rem;
		line-height: 4rem;
		letter-spacing: 0.25rem;
	}

	.tel_contact .time {
		font-size: 1.0rem;
		border-radius: 1rem;
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.form_box form {
		margin-bottom: 5rem;
		width: 100%;
	}
}
@media screen and (max-width: 576px) {
	/* 576px以下に適用されるCSS（スマホ用） */
	.form_box{
		width:100%;
		margin-right: auto;
		margin-left: auto;
		margin-top: 3rem;

	}
	.form_box table{
		width:95%;
	}
	.form_box form td,
	.form_box form th{
		width: 93%;
		display: block;
	}

	.form_box form th{
		padding-bottom: 0;


	}
	.form_box form td{
		padding-top: 0;


	}
}

/*
#sec04{
	background: url(../images/bgSec04.jpg) no-repeat 100% 100% fixed;
	background-size: cover;
	-webkit-background-size: cover;
	color: #fff;
}
*/

/* SEC05 PROFILE
------------------------------------------------------------*/

#map {
	width: 100%;
	position: relative;
	padding-bottom: 40%;
	/* これが縦横比 */
	height: 0;
	overflow: hidden;
}

#map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	z-index: 1;
}



/* no-use*/
/*
#sec05{
	padding-top: 50px;
}
*/


#sec06{
	background-color: #f6f6f6;
	padding-top: 6rem;
}

#sec06 .inner{
	/*width: 1200px;*/
	width: 950px;
	padding-bottom: 6rem;

	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

}
#sec06 .inner .information{

}
#sec06 .inner .information h2{
	font-family:  'Hammersmith One', 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	/*font-size: 4rem;*/
	font-size: 3.2rem;
	color: #737373;
	margin-top: 0;
	letter-spacing: 0.75rem;
	line-height: 4rem;

}
#sec06 .inner .information p{
	font-size: 1.2rem;
	line-height: 2.5rem;
	margin-top: 1rem;
	margin-bottom: 1rem;

}
#sec06 .inner .information p.name{
	font-size: 1.45rem;
}

#sec06 .inner .information .map_link{
	font-family:  'Hammersmith One', 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	font-size: 2rem;
	border: 1px solid black;
	text-align: center;
	/*width: 85%;*/
	width: 95%;
	/*
	padding-bottom: 1rem;
	padding-top: 1rem;
	*/
	padding-bottom: 0.5rem;
	padding-top: 0.5rem;

}
#sec06 .inner .information .map_link a{
	text-decoration: none;
	color: black;
	display: block;
}

#sec06 .inner .information .map_link a:hover{
	opacity: 0.4;
}

#sec06 .inner .map{
	width: 50%;
}
#sec06 .inner .map p{
	font-size: 1.2rem;
	line-height: 3.2rem;
    color: #f5b0bc;
}
#sec06 .inner .map iframe{
	width: 100%;
	/*height: 450px;*/
	height: 370px;
	border: none;
}
/*
#map{
	position: relative;
	padding-bottom: 75%;
	height: 0;
	overflow: hidden;
}

#map iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	border: 0;
}
*/
@media screen and (max-width: 1280px){
	#sec06 .inner {
		width: 840px;

	}
	#sec06 .inner .information h2 {
		font-size: 3rem;
		letter-spacing: 0.5rem;
		line-height: 4rem;
	}
	#sec06 .inner .information p.name {
		font-size: 1.4rem;
	}
	#sec06 .inner .information p {
		font-size: 1.0rem;
		line-height: 2.5rem;
		margin-top: 1rem;
		margin-bottom: 1rem;
	}
	#sec06 .inner .information .map_link {
		width: 90%;
	}
}
@media screen and (max-width: 840px) {
	#sec06 {
		padding-top: 2rem;
	}

	#sec06 .inner {
		width: 520px;
		justify-content: center;
		padding-bottom: 2rem;
	}

	#sec06 .inner .information h2 {
		font-size: 2rem;
		letter-spacing: 0.375rem;
		line-height: 4rem;
		text-align: left;
	}
	#sec06 .inner .information p.name {
		font-size: 1.0rem;
	}

	#sec06 .inner .information p {
		font-size: 0.8rem;
		line-height: 1.5rem;
		margin-top: 1rem;
		margin-bottom: 1rem;
	}

	#sec06 .inner .information .map_link {
		font-size: 1.5rem;
		width: 100%;
		padding-bottom: 0.5rem;
		padding-top: 0.5rem;
	}

	#sec06 .inner .map {
		margin-top: 2rem;
		width: 100%;
	}

	#sec06 .inner .map iframe {
		width: 100%;
		height: 250px;
	}

}
@media screen and (max-width: 576px) {
	#sec06 .inner {
		width: 320px;
		max-width: 100%;
	}
}


#sec10{
	margin-top: 12rem;
}

#sec10 .logo_contents{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	width: 950px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2rem;
}

#sec10 .logo_contents .logo_image{
	width: 40%;
	padding-left: 5%;
	padding-right: 5%;
	margin-left: auto;
	margin-right: auto;
}

#sec10 .logo_contents .logo_explain{
	width: 50%;

	font-size: 1.2rem;
	line-height: 3.0rem;
}

@media screen and (max-width: 950px) {
	#sec10 .logo_contents{
		width: 820px;
	}

	#sec10 .logo_contents .logo_image{
		width: 40%;

	}

	#sec10 .logo_contents .logo_explain{
		width: 50%;

	}
}

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

	#sec10 {
		margin-top: 6rem;
	}

	#sec10 .logo_contents{
		width: 570px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 2rem;
	}

	#sec10 .logo_contents .logo_image{
		width: 50%;

	}

	#sec10 .logo_contents .logo_explain{
		width: 100%;

		font-size: 1.0rem;
		line-height: 2.5rem;
	}
}

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

	#sec10 {
		margin-top: 0;
	}

	#sec10 .logo_contents{
		width: 300px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 2rem;
	}

	#sec10 .logo_contents .logo_image{
		width: 55%;
	}

	#sec10 .logo_contents .logo_explain{
		width: 100%;

		font-size: 0.9rem;
		line-height: 2.0rem;
	}

}

#sec11{
	margin-top: 12rem;
}

#sec11 .message_contents{
	width: 950px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2rem;
}

#sec11 .message_contents .message_image{
	float: right;
	width: 45%;
	padding-left: 5%;

}

#sec11 .message_contents .message_text {

	font-size: 1.2rem;
	line-height: 3.0rem;


}

@media screen and (max-width: 950px) {
	#sec11 .message_contents{
		width: 820px;

	}
}

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

	#sec11{
		margin-top: 6rem;
	}

	#sec11 .message_contents{
		width: 570px;

	}

	#sec11 .message_contents .message_image{
		float: none;
		width: 100%;
		padding-left: 0;
		margin-right: auto;
		margin-left: auto;

	}

	#sec11 .message_contents .message_text {
		font-size: 1.0rem;
		line-height: 2.5rem;
	}
}

@media screen and (max-width: 576px) {
	#sec11 .message_contents{
		width: 300px;
	}

	#sec11 .message_contents .message_text {
		font-size: 0.9rem;
		line-height: 2.0rem;
	}
}



#sec12{
	margin-top: 10rem;
	margin-bottom: 20rem;
}

#sec12 .about_officer_contents{
	width: 950px;
	margin-left : auto;
	margin-right: auto;
}

#sec12 .about_officer_contents .content_box{
	border-style: dotted;
	border-width: 5px;
	border-color: black;

	padding: 2rem 4rem;
	margin-top: 5rem;

	font-size: 1.2rem;
	line-height: 3.0rem;
}

#sec12 .about_officer_contents .content_box .profile{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;




}
#sec12 .about_officer_contents .content_box .profile .text{
	width: 60%;
}

#sec12 .about_officer_contents .content_box .job{
	font-weight: bold;
	font-size: 1.5rem;
	line-height: 0;
}
#sec12 .about_officer_contents .content_box .name{
	font-weight: bold;
	padding-top: 1rem;
	font-size: 3rem;
	line-height: 5rem;
}
#sec12 .about_officer_contents .content_box .spell{
	font-weight: bold;
	font-size: 1.5rem;
	letter-spacing: 0.1rem;
}
#sec12 .about_officer_contents .content_box .blue{
	color: #94d4ea;
}
#sec12 .about_officer_contents .content_box .pink {
	color: #f8c4cc;
}

#sec12 .about_officer_contents .content_box  dt{
  float: left;
}

#sec12 .about_officer_contents .content_box  dd{
  margin-left: 140px;
}

@media screen and (max-width: 576px) {
	#sec12 .about_officer_contents .content_box  dt{
	  float: left;
	}

	#sec12 .about_officer_contents .content_box  dd{
	  margin-left: 80px;
	}
}

#sec12 .about_officer_contents .content_box  ul {
	list-style: initial;
	margin-left: 1.5rem;
}

#sec12 .about_officer_contents .content_box  .profile_block{
	margin-top: 3rem;
}

#sec12 .about_officer_contents .content_box  .officer_image{
	width: 40%;
	height: auto;
}

@media screen and (max-width: 950px) {
	#sec12 .about_officer_contents{
		width: 820px;
	}
}

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

	#sec12{
		margin-top: 5rem;
		margin-bottom: 10rem;
	}

	#sec12 .about_officer_contents{
		width: 570px;
	}

}

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

	#sec12 .about_officer_contents{
		width: 300px;
	}

	#sec12 .about_officer_contents .content_box{

		border-width: 3px;

		padding: 1rem 0rem 1rem 1rem;
		margin-top: 2rem;

		font-size: 0.8rem;
		line-height: 1.5rem;
	}

	#sec12 .about_officer_contents .content_box .profile .text{
		width: 50%;
	}

	#sec12 .about_officer_contents .content_box  .officer_image{
		width: 50%;
		height: auto;
	}

	#sec12 .about_officer_contents .content_box .job{
		font-weight: bold;
		font-size: 0.9rem;
		line-height: 0;
	}
	#sec12 .about_officer_contents .content_box .name{
		font-weight: bold;
		padding-top: 1rem;
		font-size: 1.5rem;
		line-height: 3rem;
	}
	#sec12 .about_officer_contents .content_box .spell{
		font-weight: bold;
		font-size: 0.8rem;
		letter-spacing: 0.1rem;
	}
	#sec12 .about_officer_contents .content_box  .profile_block{
		margin-right: 1rem;
		margin-top: 3rem;
	}

}

#sec21 .business_detail {
	padding-top: 5rem;
	padding-bottom: 5rem;
	border-bottom: 10px dotted black;

	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

#sec21 .business_detail:first-child {
	margin-top: 5rem;
}

#sec21 .business_detail:last-child {
	border-bottom:none;
}

#sec21 .business_detail .content_box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	width: 950px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5rem;
}

.business_detail .content_box .blue {
	border-color: #94d4ea;
	background-color: #94d4ea;
}

.business_detail .content_box .pink {
	border-color: #f5b0bc;
	background-color: #f5b0bc;
}

.business_detail .content_box .image {
	width: 300px;
	height: 300px;
	border-radius: 50%;
	border-style: solid;
	border-width: 3px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
}

.business_detail .content_box .image img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 80%;
	height: auto;
}

.business_detail .content_box .explain {
	width: 60%;
}

.business_detail .content_box .explain h4{
	font-size: 2rem;
}

.business_detail .content_box .explain p {
	font-size: 1.2em;
}

.business_detail .content_box .explain p span{
	color: #f5b0bc;
}

.business_detail .table_text {
	width: 950px;
	font-size: 1.5rem;
	margin-right: auto;
	margin-left: auto;

}

.business_detail .table_text h5{
	margin-left: 1rem;

}
.business_detail .add_explain p,
.business_detail .table_text p{
	font-size: 1.2rem;

}

.business_detail .table_text .pc_image{
	display: initial;

}
.business_detail .table_text .sp_image{
	display: none;

}


.business_detail .add_explain {
	width: 950px;
	font-size: 1.5rem;
	margin-right: auto;
	margin-left: auto;

}

.business_detail .add_explain h4{
	font-size: 1.5rem;
	margin-right: auto;
	margin-left: auto;
	margin-top: 5rem;
	margin-bottom: 1rem;

	background-color: #cccccc;
	border-radius: 4rem;
	padding: 1rem 2rem;

}



@media screen and (max-width: 1000px) {
	.business_detail .content_box .image {
		width: 250px;
		height: 250px;
	}

	#sec21 .business_detail {
		width: 840px;
	}
	#sec21 .business_detail .content_box{
		width: 790px;
	}
	#sec21 .business_detail .content_box .explain h4 {
		font-size: 1.8rem;
	}

	.business_detail .table_text {
		width: 790px;
	}

	.business_detail .add_explain {
		width: 790px;
	}
}


@media screen and (max-width: 840px) {
	.business_detail .content_box .image {
		width: 180px;
		height: 180px;
	}

	#sec21 .business_detail {
		width: 580px;
	}
	#sec21 .business_detail .content_box{
		width: 530px;
	}
	#sec21 .business_detail .content_box .explain h4 {
		font-size: 1.8rem;
		text-align: center;
		padding-top: 1rem;
	}

	.business_detail .add_explain h4 {
		font-size: 1.2rem;

	}

	.business_detail .table_text {
		width: 530px;
	}

	.business_detail .add_explain {
		width: 530px;
	}

	.business_detail .content_box .explain {
		width: 100%;
	}
}

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

	.business_detail .content_box .image {
		width: 180px;
		height: 180px;
	}

	#sec21 .business_detail {
		width: 350px;
	}
	#sec21 .business_detail:last-child {
		padding-top: 2rem;
	}
	#sec21 .business_detail .content_box{
		width: 300px;
		margin-bottom: 0.5rem;
	}
	#sec21 .business_detail .content_box .explain h4 {
		font-size: 1.0rem;
		padding-top: 1rem;
	}

	.business_detail .content_box .explain p {
		font-size: 0.9em;
	}

	.business_detail .add_explain h4 {
		font-size: 0.75rem;
		padding: 0.5rem 0.5rem;

	}

	.add_explain p, .business_detail .table_text p {
		font-size: 0.8rem;
	}

	.business_detail .add_explain p, .business_detail .table_text p {
		font-size: 0.8rem;
	}

	.business_detail .table_text {
		width: 300px;
	}

	.business_detail .add_explain {
		width: 300px;
	}

	.business_detail .table_text .pc_image{
		display: none;
	}

	.business_detail .table_text .sp_image{
		display: initial;
	}
}

/* RESPONSIVE 設定
------------------------------------------------------------*/



@media only screen and (min-width: 841px){
	body{
		font-size:14px;
	}

    #menu{
		display:none;
	}


	.logo{
		display:flex;
		align-items: center;
	}
	.logo a{
		margin-top: 0.5rem;
		margin-bottom: 0rem;
		margin-left: auto;
		margin-right: auto;
	}
	.logo img{

		width:auto;

		height:4.0rem;

		/*height: 152px;*/
	}
	.panel{
		/*
		display:flex !important;
		flex-wrap: wrap;
		justify-content: space-between
		*/
		display: block !important;
	}
	.flex_left{
		display: none;
	}
	.flex_right{
		width:22rem;
		display: flex;
	}


	.tel_time{
		display:block;
		margin: auto 0 0.5rem auto;
	}
	.tel_time .tel{
		font-size: 1.5rem;
		line-height: 1.3;
		letter-spacing: 0;
		position: relative;
		margin-left: 1rem;
	}
	.tel_time .time{
		font-size: 0.8rem;
		line-height: 1.4;
		text-align: center;
		background: #e5e5e5;
		border-radius: 12px;
		padding: 3px 1rem;
		margin-top: 0;
	}
	.contact{
		color:rgb(255,255,255);
		background: rgb(243,170,182);
		margin: 0 0 0 auto;
    	padding: 1.5rem 1rem;
    	border-top-left-radius: 20px;
		position: relative;
		width: 6rem;
		/*height: 1rem;*/
		line-height: 4rem;
	}
	.contact:hover{
		opacity: 0.5;
		transition: 0.2s;
	}
	#mainnav .contact a{
		color:rgb(255,255,255);
		display: block;
		position: absolute;
		/**/top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.mobile_only{
		display:none !important;
	}

	#mainnav{
		position:fixed;
		/*position:sticky;*/
		top: 0;
		width:100%;
		z-index:500;
		background: rgb(255,255,255);
	}

	#mainnav ul{
		/*text-align: left;*/
		text-align: center;
		/*padding-right: 800px;*/
	}

	#mainnav li{
		display: inline-block;
		/*padding: 25px 10px 20px;*/
		padding-top: 0;
		padding-bottom: 0.5rem;
		padding-right: 0.5rem;
		padding-left: 0.5rem;/**/
		/*
		font-size: 14px;*/
		/*font-size: 1.5rem;*/
		font-size: 1.0rem;
		font-weight: 300;
	}

  #mainnav a{
		color: #000;
	}

	#mainnav.changeNav{
		background: rgba(255,255,255,.9);
		border-bottom: 1px solid #d1d1d1;
	}

	#mainnav.changeNav li{
		/*padding: 20px 10px;*/
	}

	/* SEC02 MESSAGE
	-----------------*/
	.txt, .bg{
		width: 50%;
		float: left;
		display: table;
	background: #E7F9FF;
	}

	#sec02_02 .txt, #sec02_02 .bg{
		float: right;
	}

	.vMid{
		display: table-cell;
		padding: 0 100px;
		vertical-align: middle;
	}

	/* SEC03 SERVICE MESSAGE STORY
	-----------------*/
	.col3{
		text-align: center;
	}

	.col3 li{
		display: inline-block;
		width: 30%;
		padding: 0 1.5%;
		margin-bottom: 0;
		vertical-align: top;
		text-align: left;
	}


  #footer{
		padding: 30px 10px 70px 0;
	}
}
@media only screen and (min-width: 1200px){
	.inner{
		width: 1024px;
		padding-bottom: 120px;
	}
	.txt h2{
		padding: 0 0 20px !important;
	}
	.panel{
		/*
		display:flex !important;
		flex-wrap: wrap;
		justify-content: space-between
		*/
		display: block !important;
	}
	.flex_right,
	.flex_left{
		width:22rem;
		display: flex;
	}
}
@media only screen and (min-width: 641px){
	.col2 li{
		width: 40%;
		padding: 0 3%;
		vertical-align: top;
	}
}

@media only screen and (max-width: 640px){
	#map iframe{
	  width: 96% !important;
		left: 2%;
	}
}

@media only screen and (max-width: 840px){
	#slogan h1{
		font-size: 31px;
	}

	#slogan h2{
		font-size: 16px;
	}
/*
    #menu{
  	display: inline-block;
  	position: relative;
  	width: 40px;
  	height: 40px;
  	margin: 10px;
	}

	#menuBtn{
  	display: block;
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	width: 18px;
  	height: 2px;
  	margin: -1px 0 0 -7px;
  	background: #fff;
  	transition: .2s;
	}

	#menuBtn:before, #menuBtn:after{
  	display: block;
  	content: "";
  	position: absolute;
  	top: 50%;
  	left: 0;
  	width: 18px;
  	height: 2px;
  	background: #fff;
  	transition: .3s;
	}

	#menuBtn:before{
  	margin-top: -7px;
	}

	#menuBtn:after{
  	margin-top: 5px;
	}

	a#menu .close{
  	background: transparent;
	}

	a#menu .close:before, a#menu .close:after{
  	margin-top: 0;
	}

	a#menu .close:before{
  	transform: rotate(-45deg);
  	-webkit-transform: rotate(-45deg);
	}

	a#menu .close:after{
  	transform: rotate(-135deg);
  	-webkit-transform: rotate(-135deg);
	}
*/
	.panel{
		width: 100%;
		display: none;
		overflow: hidden;
		position: relative;
		left: 0;
		top: 0;
		z-index: 100;
	}

	#mainnav{
		/*position: absolute;*/
		position:sticky;
		top: 0;
		right: 0;
		width: 100%;
		text-align: right;
		z-index:500;
		background: white;
	}

	#mainnav ul{
		border-bottom: 1px solid #ccc;
		background: #fff;
		text-align: left;
	}

	#mainnav li a{
		position: relative;
		display:block;
		padding:15px 25px;
		border-bottom: 1px solid #ccc;
		color: #000;
		font-weight: 400;
	}

	#mainnav li a:before{
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 5px;
		width: 6px;
		height: 6px;
		margin: -4px 0 0 0;
		border-top: solid 2px #000;
		border-right: solid 2px #000;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.col3 li{
		margin: 0 auto;
		display: block;
	max-width: 288px;
	}

	span.logo{
		display: none;!important;

	}
	span.logo img{
		background:white;

	}
	.tel_time{
		display:none;
	}
	.panel .contact{
		display:none !important;
	}
	.mobile_only{
		display:show !important;
	}
}

@media only screen and (max-width: 1199px){

}
