@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------------
　基本設定
--------------------------------------------------------*/
html {
  font-size: 62.5%;
  /*visibility: hidden;*/
}

body {
	width: 100%;
	font-family: "Zen Old Mincho", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	color:#333;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: 400;
	font-feature-settings: "palt";
	text-align: justify;
	background:#FFF;
	line-height:1.6;
	text-size-adjust: 100%;
	position: relative;
	z-index: 0;
}


*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

img{
	width: 100%;
	height: auto;
	-ms-interpolation-mode: bicubic;
}

a{
	text-decoration: none;
	outline: none;
}

a:hover{
	text-decoration: none;
}

f_en {
	font-family: "Mrs Saint Delafield", cursive;
}

f_go {
	font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}

header,main,footer {
	width: 100%;
}

header {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
}

footer {
	background: #efefef;
	position: relative;
	z-index: 3;
}

main{
	
}

article {
	contain: paint;
}

/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 769px){
	.sp{
		display: none!important;
	}
	
	a.tel[href^="tel:"] {
       pointer-events: none;
       text-decoration: none;
    }
	
	a.opacity {
		transition-duration: 0.5s;
		transition-property: opacity, color;
	}
	
	a.opacity:hover {
		opacity: 0.7;
	}
	
	a.hover_red,
	a.hover_black{
		position: relative;
		overflow: hidden;
		z-index: 1;
	}
	
	a.hover_red::before,
	a.hover_black::before{
		content: "";
		width: 100%;
		height: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -3;
	}
	
	a.hover_red::before {
		background: #000;
	}
	
	a.hover_red.white::before {
		background: #FFF;
	}
	
	a.hover_black::before {
		background: #ff0000;
	}
	
	a.hover_black.yellow::before {
		background: #d9c300;
	}
	
	a.hover_red::after,
	a.hover_black::after{
		content: "";
		width: 0;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		transition: width .35s ease;
	}
	
	a.hover_red::after {
		background: #ff0000;
	}
	
	a.hover_black::after {
		background: #000;
	}
	
	a.hover_red:hover::after,
	a.hover_black:hover::after{
		width: 100%;
	}
	
	header {
		padding-top: 2.96vw;
		padding-top: 2.96cqw;
		padding-left: 3.5%;
	}
	
	header h1 {
		width: 22.9%;
		max-width: 294px;
		line-height: 0;
	}
	
	header a{
		display: block;
	}
	
	#mv {
		position: relative;
		z-index: 0;
		line-height: 0;
	}
	
	#mv div.bg{
		position: relative;
		z-index: 1;
	}
	
	#mv h2{
		width: 43%;
		position: absolute;
		bottom: -10.3vw;
		bottom: -10.3cqw;
		left: 28.5%;
		z-index: 3;
	}
	
	#mv figure {
		width: 16.8%;
		position: absolute;
		bottom: 23.8vw;
		bottom: 23.8cqw;
		left: 41.6%;
		z-index: 3;
	}
	
	section div.inner {
		padding-bottom: 32.4vw;
		padding-bottom: 32.4cqw;
	}
	
	section div.inner::after {
		content: "";
		width: 100%;
		height: 32.4vw;
		height: 32.4cqw;
		display: block;
		background: url("../images/th100/bg_wave_bottom.svg") no-repeat;
		background-size: cover;
		position: absolute;
		bottom: -2px;
		left: 0;
		z-index: 1;
	}
	
	section div.inner figure.photo {
		line-height: 0;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.text {
		font-size: 1.44rem;
		font-size: clamp(1.44rem, 1.87vw, 2.4rem);
		text-align: left;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.text h4{
		font-size: 4.2rem;
		font-size: clamp(4.2rem, 5.46vw, 7.0rem);
		font-weight: 400;
		font-style: italic;
		line-height: 1;
	}
	
	section div.inner div.text p{
		font-size: 1.44rem;
		font-size: clamp(1.44rem, 1.87vw, 2.4rem);
		line-height: 1.8;
	}
	
	section div.inner div.anker {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 10vw;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.anker a{
		width: 22.9%;
		max-width: 294px;
		height: 5.15vw;
		height: 5.15cqw;
		max-height: 66px;
		display: block;
		background: #009fe8;
		border-radius: 50px;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 1.32rem;
		font-size: clamp(1.32rem, 1.71vw, 2.2rem);
		line-height: 1;
		color: #FFF;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		position: relative;
	}
	
	section div.inner div.anker a::after{
		content: "";
		width: 44px;
		height: 44px;
		display: inline-block;
		position: absolute;
		bottom: -22px;
		left: calc(50% - 22px);
		background: url("../images/th100/anker_arrow.svg") no-repeat;
		background-size: contain;
	}
	
	section div.inner div.anker a::after{
		transition: .5s all ease;
	}
	
	section div.inner div.anker a:hover::after{
		bottom:-30px;
		transform:scale(1.2,1.2);
	}
	
	section div.section_inner {
		width: 90%;
		max-width: 1150px;
		margin: 0 auto;
	}
	
	section div.section_inner div.item {
		position: relative;
	}
	
	section.history01 {
		padding-top: 26.4vw;
		position: relative;
		z-index: 0;
	}
	
	section.history01 h3{
		font-size: 3.6rem;
		font-size: clamp(2.16rem, 2.81vw, 3.6rem);
		font-weight: 400;
		line-height: 1;
		letter-spacing: 0.08em;
		text-align: center;
	}
	
	section.history01 h3 span{
		display: inline-block;
		padding-bottom: 0.5em;
		position: relative;
		margin-bottom: 2em;
	}
	
	section.history01 h3 span::after{
		content: "";
		width: 2.4em;
		height: 0.3vw;
		max-height: 4px;
		background: #009fe8;
		display: inline-block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.2em);
	}
	
	section.history01 div.inner {
		margin-top: 3.5vw;
		padding-top: 13.5vw;
		padding-top: 13.5cqw;
		position: relative;
		background: #e9f7fd;
	}
	
	section.history01 div.inner::before {
		content: "";
		width: 100%;
		height: 13.5vw;
		height: 13.5cqw;
		display: block;
		background: url("../images/th100/bg_ellipse_white.svg") no-repeat;
		background-size: cover;
		position: absolute;
		top: -2px;
		left: 0;
		z-index: 1;
	}
	
	section div.inner div.item div.text {
		margin-top: -2em;
	}
	
	section div.inner div.block_sns_add {
		width: 100%;
		position: relative;
	}
	
	section div.inner div.block_sns_add ul.sns{
		width: 15%;
		list-style: none;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: absolute;
	}
	
	section div.inner div.block_sns_add ul.sns li{
		width: 42%;
	}
	
	section.history01 div.inner div.item01{
		width: 50%;
		border-radius: 1.56vw;
		overflow: hidden;
		margin: -15.3vw auto 6.2vw;
		background: #FFF;
		box-shadow: 14px 14px 0px 0px rgba(239, 239, 239, 1);
		position: relative;
		z-index: 5;
	}
	
	section.history01 div.inner div.item01 div.text {
		width: 80%;
		margin: 0 auto;
	}
	
	section.history01 div.inner div.item01 div.text p{
		padding-bottom: 1.25em;
	}
	
	section.history01 div.inner div.item02 {
		width: 42.8%;
		margin-left: 8.7%;
	}
	
	section.history01 div.inner div.item03 {
		width: 40%;
		margin-top: -260px;
		margin-left: 55.9%;
	}
	
	section.history01 div.inner div.item03 figure.photo{
		width: 93.6%;
	}
	
	section.history01 div.inner div.item04 {
		width: 36%;
		margin-left: 6%;
	}
	
	section.history01 div.inner div.item05 {
		width: 48%;
		margin-top: -200px;
		margin-left: 47%;
	}
	
	section.history01 div.inner div.item06 {
		width: 34.7%;
		margin-top: -50px;
		margin-left: 10%;
	}
	
	section.history01 div.inner div.item06 div.text {
		margin-top: -3em;
	}
	
	section.history01 div.inner div.block_sns_add ul.sns {
		top: 50%;
		right: 10%;
	}
	
	section div.inner div.block_sns_add ul.sns li{
		transition: .4s all ease;
	}
	
	section div.inner div.block_sns_add ul.sns li:hover{
		transform:scale(1.2,1.2);
	}
	
	section.history01 div.inner div.item07 {
		width: 37.2%;
		margin-left: 44.6%;
	}
	
	section.history01 div.inner div.item07 div.text {
		margin-top: 0;
	}
	
	section.message {
		padding: 5vw 0 10vw;
		position: relative;
		z-index: 0;
	}
	
	section.message.obi::after {
		content: "";
		width: 24vw;
		width: 24cqw;
		height: 100%;
		background: #e9572b;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		transform: scaleY(0);
        transform-origin: top;
        transition: transform 1s ease;
	}
	
	section.message.obi.is-active::after {
      transform: scaleY(1);
    }
	
	section.message.obi.message02::after {
		content: "";
		height: 80%;
		background: #39237e;
	}
	
	section.message h3{
		font-size: 3.0rem;
		font-size: clamp(1.8rem, 2.34vw, 3.0rem);
		font-weight: 400;
		line-height: 1;
		letter-spacing: -0.04em;
		text-align: center;
		margin-bottom: 2em;
	}
	
	section.message h3 span{
		display: inline-block;
		position: relative;
	}
	
	section.message h3 span::before{
		content: "";
		width: 3em;
		height: 2px;
		background: #333;
		display: inline-block;
		position: absolute;
		top: 0.5em;
		left: -3.5em;
	}
	
	section.message h3 span::after{
		content: "";
		width: 3em;
		height: 2px;
		background: #333;
		display: inline-block;
		position: absolute;
		top: 0.5em;
		right: -3.5em;
	}
	
	section.message h3 span small{
		font-family: "Mrs Saint Delafield", cursive;
		font-size: 4.4rem;
		font-size: clamp(2.64rem, 3.43vw, 4.4rem);
		color: #a67c52;
	}
	
	section.message h1{
		font-size: 3.8rem;
		font-size: clamp(2.28rem, 2.96vw, 3.8rem);
		font-weight: 400;
		line-height: 1.4;
		text-align: center;
		margin-bottom: 1.75em;
	}
	
	section.message div.box{
		width: 90%;
		max-width: 1150px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section.message div.box figure.photo{
		width: 42%;
		line-height: 0;
		margin-left: -5.7%;
	}
	
	section.message div.box div.text{
		width: 60%;
	}
	
	section.message div.box div.text p,
	section.message div.box div.text div.sign_box{
		font-size: 2.0rem;
		font-size: clamp(1.2rem, 1.56vw, 2.0rem);
		line-height: 1.85;
	}
	
	section.message div.box div.text p + p{
		margin-top: 1em;
	}
	
	section.message div.box div.text div.sign_box {
		margin-top: 2em;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
	section.message div.box div.text div.sign_box p{
		display: inline-block;
	}
	
	section.message div.box div.text div.sign_box p b{
		font-size: 140%;
	}
	
	section.message div.box02{
		width: 85%;
		margin: 8vw auto 0;
		position: relative;
	}
	
	section.message div.box02 dl{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section.message div.box02 dl + dl{
		margin-top: 2vw;
	}
	
	section.message div.box02 dl dt{
		width: 33.5%;
		font-size: 2.8rem;
		font-size: clamp(1.68rem, 2.18vw, 2.8rem);
		font-weight: 400;
		line-height: 1;
		color: #FFF;
		background: #009fe8;
		padding: 0.5em 0.5em;
	}
	
	section.message div.box02 dl dt small{
		font-size: 70%;
	}
	
	section.message div.box02 dl dd{
		width: 64%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		font-size: 1.8rem;
		font-size: clamp(1.08rem, 1.4vw, 1.8rem);
		font-weight: 400;
	}
	
	section.message div.box03 {
		width: 78%;
		margin: 6.5vw auto 0;
		background: #FFF;
		border: 4px solid #efefef;
		border-radius: 20px;
		padding: 3.5vw 9%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section.message div.box03 div.left_box{
		width: 34.5%;
	}
	
	section.message div.box03 div.right_box{
		width: 50%;
	}
	
	section.message div.box03 div.right_box div{
		position: relative;
		cursor: pointer;
		line-height: 0;
	}
	
	section.message div.box03 div.right_box div span{
		display: block;
		width: 18.8%;
		position: absolute;
		top: 31.6%;
		left: 40.6%;
		z-index: 3;
		transition:.5s all;
	}
	
	section.message div.box03 div.right_box div:hover span{
		transform:scale(1.2,1.2);
	}
	
	section.message div.box03 div h5 {
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 2.4rem;
		font-size: clamp(1.44rem, 1.87vw, 2.4rem);
		font-weight: 500;
		line-height: 1;
		color: #009fe8;
		text-align: center;
		margin-bottom: 1.25em;
	}
	
	section.message div.box03 div h5 span{
		display: inline-block;
		position: relative;
		padding-bottom: 1em;
	}
	
	section.message div.box03 div h5 span::after{
		content: "";
		width: 2.4em;
		height: 3px;
		background: #009fe8;
		display: block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.2em);
	}
	
	section.history02 div.inner,
	section.history03 div.inner{
		padding-top: 32.4vw;
		padding-top: 32.4cqw;
		position: relative;
		background: #e9f7fd;
	}
	
	section.history02 div.inner::before,
	section.history03 div.inner::before{
		content: "";
		width: 100%;
		height: 32.4vw;
		height: 32.4cqw;
		display: block;
		background: url("../images/th100/bg_wave_top.svg") no-repeat;
		background-size: cover;
		position: absolute;
		top: -2px;
		left: 0;
		z-index: 1;
	}
	
	section.history02 div.inner div.item08 {
		width: 34.9%;
		margin-top: -10vw;
		margin-left: 8.18%;
	}
	
	section.history02 div.inner div.item08 div.text {
		margin-top: 0;
	}
	
	section.history02 div.inner div.item09 {
		width: 40.6%;
		margin-top: -64px;
		margin-left: 47.5%;
	}
	
	section.history02 div.inner div.item09 div.text {
		margin-top: -1em;
	}
	
	section.history02 div.inner div.item10 {
		width: 34.7%;
		margin-top: -12px;
		margin-left: 14.9%;
	}
	
	section.history02 div.inner div.item10 div.text {
		margin-top: 0;
	}
	
	section.history02 div.inner div.item11{
		width: 32%;
		margin-top: -192px;
		margin-left: 59%;
	}
	
	section.history02 div.inner div.item11 div.text {
		margin-top: 1em;
	}
	
	section.history02 div.inner div.item12{
		width: 33.6%;
		margin-left: 23.8%;
	}
	
	section.history02 div.inner div.item12 div.text {
		margin-top: -0.75em;
	}
	
	section.history02 div.inner div.block_sns_add ul.sns {
		top: -102px;
		left: 10%;
	}
	
	section.history02 div.inner div.item13{
		width: 45%;
		margin-top: -3vw;
		margin-left: 39.2%;
	}
	
	section.history02 div.inner div.item13 div.text {
		margin-top: -1.5em;
	}
	
	section.history03 div.inner {
        padding-bottom: 0;
    }
	
	section.history03 div.inner div.item14{
		width: 38.6%;
		margin-top: -172px;
		margin-left: 8.8%;
	}
	
	section.history03 div.inner div.item15{
		width: 42.7%;
		margin-top: -9.7vw;
		margin-left: 50.4%;
	}
	
	section.history03 div.inner div.item15 div.text {
		margin-top: -0.5em;
	}
	
	section.history03 div.inner div.item16{
		width: 33.6%;
		margin-top: 4vw;
		margin-left: 19%;
	}
	
	section.history03 div.inner div.item16 div.text {
		margin-top: -0.5em;
	}
	
	section.history03 div.inner div.block_sns_add ul.sns {
		top: -256px;
		left: 10%;
	}
	
	section.history03 div.inner div.item17{
		width: 43.3%;
		margin-top: 1vw;
		margin-left: 38.2%;
		position: relative;
		z-index: 3;
	}
	
	section.history03 div.inner div.item17 div.text {
		margin-top: -0.5em;
	}
	
	section#project {
		margin-top: 18vw;
		padding-top: 10vw;
	}
	
	section#project div.procect_inner {
		position: relative;
	}
	
	section#project div.procect_inner h2{
		width: 55.4%;
		position: absolute;
		top: -10.8vw;
		left: 22.3%;
		z-index: 3;
		line-height: 1.4;
		text-align: center;
	}
	
	section#project div.procect_inner h2 small{
		font-family: "Mrs Saint Delafield", cursive;
		font-size: 4.4rem;
		font-size: clamp(2.64rem, 3.43vw, 4.4rem);
		font-weight: 400;
		color: #a67c52;
	}
	
	section#project div.procect_inner div.bg{
		position: relative;
		z-index: 0;
		line-height: 0;
	}
	
	section#project div.procect_inner ul.contents{
		width: 81.5%;
		position: absolute;
		top: 14.5vw;
		left: 9.25%;
		z-index: 3;
		list-style: none;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section#project div.procect_inner ul.contents li{
		width: 28%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	
	section#project div.procect_inner ul.contents li div.card-content{
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 3.4rem;
		font-size: clamp(2.04rem, 2.65vw, 3.4rem);
		line-height: 1.38;
		font-weight: 500;
		text-align: center;
	}
	
	section#project div.procect_inner ul.contents li div.card-content span{
		display: inline-block;
		padding-bottom: 0.7em;
		position: relative;
	}
	
	section#project div.procect_inner ul.contents li div.card-content span::after{
		content: "";
		width: 3em;
		height: 4px;
		background: #a67c52;
		display: block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.5em);
	}
	
	footer div.banner {
		width: 90%;
		height: 18vw;
		height: 18cqw;
		position: absolute;
		top: -12vw;
		top: -12cqw;
		left: 5%;
		z-index: 5;
		background: #FFF;
		border-radius: 1.56vw;
		overflow: hidden;
		box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.5);
	}
	
	footer div.banner a{
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		background: url("../images/th100/banner_pc.jpg") no-repeat;
		background-size: cover;
		color: #FFF;
	}
	
	footer div.banner a div.text h3{
		font-family: "Zen Old Mincho", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
		font-size: 4.8rem;
		font-size: clamp(2.88rem, 3.75vw, 4.8rem);
		line-height: 1;
		font-weight: 500;
		text-align: center;
		margin-bottom: 0.5em;
	}
	
	footer div.banner a div.text h3 span{
		display: inline-block;
		padding-bottom: 0.25em;
		border-bottom: 5px solid #FFF;
	}
	
	footer div.banner a div.text p{
		font-size: 3.0rem;
		font-size: clamp(1.8rem, 2.34vw, 3.0rem);
		line-height: 1;
		font-weight: 400;
		letter-spacing: 0.14em;
		text-align: center;
	}
	
	.glass-item {
      width: 100%;
      list-style: none;
      transform: translateY(40px);
      transition: transform 0.8s ease;
      will-change: transform;
    }
	
	.glass-item.is-visible {
      transform: translateY(0);
    }

	.liquid-glass-card {
      position: relative;
      width: 100%;
      height: 19.5vw;
      border-radius: 2.18vw;
	  transform: translateZ(0);
      isolation: isolate;
	  background: rgba(250, 250, 250, 0.02);
      box-shadow:
        -4px 12px 20px 0 rgba(51, 51, 51, 0.22),
        inset 0px 0px 4px 2px rgba(255, 255, 255, 0.45);
    }
	
	.liquid-glass-card::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: 2.18vw;
      box-shadow: inset 0 0 12px -4px rgba(255, 255, 255, 1);
      background-color: rgba(255, 255, 255, 0);
      pointer-events: none;
    }
	
	.liquid-glass-card::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: -1;
      border-radius: 2.18vw;
      backdrop-filter: blur(15px);
      -webkit-backdrop-filter: blur(15px);
      filter: url(#glass-distortion);
      -webkit-filter: url(#glass-distortion);
      isolation: isolate;
      pointer-events: none;
    }
	
    .card-content,
    .card-body {
      position: relative;
      z-index: 2;
    }

    /* 文字だけ少しフェード */
    .card-body {
      opacity: 0;
      transform: translateY(12px);
      transition:
        opacity 0.8s ease 0.15s,
        transform 0.8s ease 0.15s;
    }

    .glass-item.is-visible .card-body {
      opacity: 1;
      transform: translateY(0);
    }

	
	
	footer {
        padding: 14vw 0 4vw;
		background: #efefef;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    }
	
	footer div.f_block {
		width: 90%;
		max-width: 1150px;
		margin: 0 auto;
	}
	
	footer div.f_block h2{
		width: 25.6%;
		line-height: 0;
	}
	
	footer div.f_block p{
		font-size: 1.2rem;
		font-size: clamp(0.72rem, 0.937vw, 1.2rem);
		line-height: 1.5;
		color: #4d4d4d;
	}
	
	footer div.f_block p:first-of-type{
		margin-top: 1em;
	}
}


@media screen and (min-width:769px) and (max-width: 1280px){
	
	section div.inner div.anker a::after{
		content: "";
		width: 3.43vw;
		width: 3.43cqw;
		height: 3.43vw;
		height: 3.43cqw;
		bottom: -1.715vw;
		bottom: -1.715cqw;
		left: calc(50% - 1.715vw);
		left: calc(50% - 1.715cqw);
	}
	
	section div.inner div.anker a:hover::after{
		bottom: calc(-1.715vw - 5px);
		bottom: calc(-1.715cqw - 5px);
		transform:scale(1.2,1.2);
	}
	
	section.history01 div.inner div.item01{
		border-radius: 1.56vw;
	}
	
	section.history01 div.inner div.item03 {
		margin-top: -22vw;
	}
	
	section.history01 div.inner div.item05 {
		margin-top: -20vw;
	}
	
	section.history01 div.inner div.item06 {
		margin-top: -6vw;
	}
	
	section.history02 div.inner div.item09 {
		margin-top: -5vw;
	}
	
	section.history02 div.inner div.item10 {
		margin-top: -1vw;
	}
	
	section.history02 div.inner div.item11{
		margin-top: -15vw;
	}
	
	section.history02 div.inner div.block_sns_add ul.sns {
		top: -8vw;
	}
	
	section.history03 div.inner div.item14{
		margin-top: -13.2vw;
	}
	
	section.history03 div.inner div.block_sns_add ul.sns {
		top: -20vw;
	}
}
	

/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

@media screen and (max-width: 768px){
	/*360-768px
	font-size: clamp(6.25rem, 17.3vw, 16.62rem);
	font-size: clamp(4rem, 11.1vw, 10.664rem);
	font-size: clamp(3rem, 8.31vw, 7.98rem);
	font-size: clamp(2.8rem, 7.75vw, 7.448rem);
	font-size: clamp(2.6rem, 7.2vw, 6.916rem);
	font-size: clamp(2.4rem, 6.65vw, 6.384rem);
	font-size: clamp(2.2rem, 6.09vw, 5.852rem);
	font-size: clamp(2.0rem, 5.54vw, 5.32rem);
	font-size: clamp(1.84rem, 5.1vw, 4.905rem);
	font-size: clamp(1.8rem, 4.98vw, 4.788rem);
	font-size: clamp(1.65rem, 4.58vw, 4.398rem);
	font-size: clamp(1.6rem, 4.43vw, 4.256rem);
	font-size: clamp(1.56rem, 4.33vw, 4.158rem);
	font-size: clamp(1.47rem, 4.08vw, 3.919rem);
	font-size: clamp(1.4rem, 3.87vw, 3.724rem);
	font-size: clamp(1.38rem, 3.83vw, 3.679rem);
	font-size: clamp(1.3rem, 3.6vw, 3.465rem);
	font-size: clamp(1.2rem, 3.32vw, 3.192rem);
	font-size: clamp(1.1rem, 3.054vw, 2.9326rem);
	font-size: clamp(1rem, 2.77vw, 2.66rem);
	font-size: clamp(0.92rem, 2.55vw, 2.45rem);
	font-size: clamp(1.2rem, 3.32vw, 2.55rem);
	46.8%
	*/
	
	.pc{
		display: none!important;
	}
	
	a:hover{
		text-decoration: none;
		opacity: 1;
	}
	
   a.tel[href^="tel:"] {
       pointer-events: auto;
       text-decoration: none;
    }
	
	a.hover_red,
	a.hover_black{
		position: relative;
		overflow: hidden;
		z-index: 1;
	}
	
	a.hover_red::before,
	a.hover_black::before{
		content: "";
		width: 100%;
		height: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -3;
	}
	
	a.hover_red::before {
		background: #000;
	}
	
	a.hover_black::before {
		background: #ff0000;
	}
	
	body nav.slide_nav div.close_btn {
        width: 10vw;
        height: 10vw;
        position: absolute;
        top: 2vw;
        right: 5%;
        cursor: pointer;
    }
	
	header {
		padding-top: 4.4vw;
		padding-top: 4.4cqw;
		padding-left: 3.5%;
	}
	
	header h1 {
		width: 46.3%;
		line-height: 0;
	}
	
	header a{
		display: block;
	}
	
	#mv {
		position: relative;
		z-index: 0;
		line-height: 0;
	}
	
	#mv div.bg{
		position: relative;
		z-index: 1;
	}
	
	#mv h2{
		width: 62%;
		position: absolute;
		bottom: -14.7vw;
		bottom: -14.7cqw;
		left: 24%;
		z-index: 3;
	}
	
	#mv figure {
		width: 30%;
		position: absolute;
		bottom: 34.8vw;
		bottom: 34.8cqw;
		left: 35%;
		z-index: 3;
	}
	
	section div.inner {
		padding-bottom: 32.4vw;
		padding-bottom: 32.4cqw;
	}
	
	section div.inner::after {
		content: "";
		width: 100%;
		height: 32.4vw;
		height: 32.4cqw;
		display: block;
		background: url("../images/th100/bg_wave_bottom.svg") no-repeat;
		background-size: cover;
		position: absolute;
		bottom: -2px;
		left: 0;
		z-index: 1;
	}
	
	section div.inner figure.photo {
		line-height: 0;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.text {
		text-align: left;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.text h4{
		font-size: 4.1rem;
		font-size: clamp(4.1rem, 11.45vw, 8.8rem);
		font-weight: 400;
		font-style: italic;
		line-height: 1;
		margin-bottom: 0.1em;
	}
	
	section div.inner div.text p{
		font-size: 1.4rem;
		font-size: clamp(1.4rem, 3.9vw, 3.0rem);
		line-height: 1.6;
	}
	
	section div.inner div.anker {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 10vw;
		position: relative;
		z-index: 3;
	}
	
	section div.inner div.anker a{
		width: 38.2%;
		max-width: 294px;
		height: 8.59vw;
		height: 8.59cqw;
		max-height: 66px;
		display: block;
		background: #009fe8;
		border-radius: 50px;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 1.02rem;
		font-size: clamp(1.02rem, 2.86vw, 2.2rem);
		line-height: 1;
		color: #FFF;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		position: relative;
	}
	
	section div.inner div.anker a::after{
		content: "";
		width: 5.72vw;
		width: 5.72cqw;
		height: 5.72vw;
		height: 5.7cqw;
		display: inline-block;
		position: absolute;
		bottom: -2.86vw;
		bottom: -2.86cqw;
		left: calc(50% - 2.86vw);
		left: calc(50% - 2.86cqw);
		background: url("../images/th100/anker_arrow.svg") no-repeat;
		background-size: contain;
	}
	
	section div.section_inner {
		width: 90%;
		margin: 0 auto;
	}
	
	section div.section_inner div.item {
		position: relative;
	}
	
	section.history01 {
		padding-top: 45vw;
		position: relative;
		z-index: 0;
	}
	
	section.history01 h3{
		font-size: 2.1rem;
		font-size: clamp(2.1rem, 5.85vw, 4.5rem);
		font-weight: 400;
		line-height: 1;
		letter-spacing: 0.08em;
		text-align: center;
	}
	
	section.history01 h3 span{
		display: inline-block;
		padding-bottom: 0.5em;
		position: relative;
		margin-bottom: 2em;
	}
	
	section.history01 h3 span::after{
		content: "";
		width: 2.4em;
		height: 0.52vw;
		max-height: 4px;
		background: #009fe8;
		display: inline-block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.2em);
	}
	
	section.history01 div.inner {
		margin-top: 21vw;
		padding-top: 13.41vw;
		padding-top: 13.41cqw;
		position: relative;
		background: #e9f7fd;
	}
	
	section.history01 div.inner::before {
		content: "";
		width: 100%;
		height: 13.41vvw;
		height: 13.41cqw;
		display: block;
		background: url("../images/th100/bg_ellipse_white.svg") no-repeat;
		background-size: cover;
		position: absolute;
		top: -2px;
		left: 0;
		z-index: 1;
	}
	
	section div.inner div.item div.text {
		margin-top: -2em;
	}
	
	section div.inner div.block_sns_add {
		width: 100%;
		position: relative;
	}
	
	section div.inner div.block_sns_add ul.sns{
		width: 40%;
		margin: 20vw auto;
		list-style: none;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section div.inner div.block_sns_add ul.sns li{
		width: 42%;
	}
	
	section.history01 div.inner div.item01{
		width: 84%;
		border-radius: 2.6vw;
		overflow: hidden;
		margin: -15.3vw auto 6.2vw;
		background: #FFF;
		box-shadow: 10px 10px 0px 0px rgba(239, 239, 239, 1);
		position: relative;
		z-index: 5;
	}
	
	section.history01 div.inner div.item01 div.text {
		width: 80%;
		margin: 0 auto;
	}
	
	section.history01 div.inner div.item01 div.text p{
		padding-bottom: 1.25em;
	}
	
	section.history01 div.inner div.item01 div.text p span.sp{
		width: 4em;
		display: inline-block;
	}
	
	section.history01 div.inner div.item02 {
		margin-top: 20vw;
		width: 85.6%;
	}
	
	section.history01 div.inner div.item03 {
		width: 80%;
		margin-top: 18vw;
		margin-left: 20%;
	}
	
	section.history01 div.inner div.item03 figure.photo{
		width: 93.6%;
	}
	
	section.history01 div.inner div.item04 {
		width: 72%;
		margin-top: 10vw;
		margin-left: 2.5%;
	}
	
	section.history01 div.inner div.item05 {
		width: 96%;
		margin-top: 15vw;
		margin-left: 2%;
	}
	
	section.history01 div.inner div.item06 {
		width: 69.2%;
		margin-top: 15vw;
		margin-left: 30%;
	}
	
	section.history01 div.inner div.item06 div.text {
		margin-top: -3em;
	}
	
	section.history01 div.inner div.block_sns_add ul.sns {
		top: 50%;
		right: 10%;
	}
	
	section.history01 div.inner div.item07 {
		width: 69.2%;
		margin-top: 5vw;
		margin-left: 10%;
	}
	
	section.history01 div.inner div.item07 div.text {
		margin-top: 0;
	}
	
	section.message {
		padding: 20vw 0 15vw;
		position: relative;
		z-index: 0;
	}
	
	section.message h3{
		font-size: 2.24rem;
		font-size: clamp(2.24rem, 6.25vw, 4.8rem);
		font-weight: 400;
		line-height: 1;
		letter-spacing: -0.04em;
		text-align: center;
		margin-bottom: 2em;
	}
	
	section.message h3 span{
		display: inline-block;
		position: relative;
	}
	
	section.message h3 span::before{
		content: "";
		width: 2em;
		height: 1px;
		background: #333;
		display: inline-block;
		position: absolute;
		top: 0.5em;
		left: -2.5em;
	}
	
	section.message h3 span::after{
		content: "";
		width: 2em;
		height: 1px;
		background: #333;
		display: inline-block;
		position: absolute;
		top: 0.5em;
		right: -2.5em;
	}
	
	section.message h3 span small{
		font-family: "Mrs Saint Delafield", cursive;
		font-size: 3.36rem;
		font-size: clamp(3.36rem, 9.37vw, 7.2rem);
		color: #a67c52;
	}
	
	section.message h1{
		font-size: 2.71rem;
		font-size: clamp(2.71rem, 7.55vw, 5.8rem);
		font-weight: 400;
		line-height: 1.4;
		text-align: center;
		margin-bottom: 1em;
	}
	
	section.message div.box{
		width: 90%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column-reverse;
		position: relative;
		padding-bottom: 24vw;
	}
	
	section.message div.box figure.photo{
		width: 100%;
		line-height: 0;
		margin-top: 20vw;
		position: relative;
	}
	
	section.message div.box figure.photo.obi::after {
		content: "";
		width: 40vw;
		width: 40cqw;
		height: 130%;
		background: #e9572b;
		display: block;
		position: absolute;
		top: -5%;
		left: -5.7%;
		z-index: -1;
		transform: scaleY(0);
        transform-origin: top;
        transition: transform 1s ease;
	}
	
	section.message div.box figure.photo.obi.is-active::after {
      transform: scaleY(1);
    }
	
	section.message.message02 div.box figure.photo.obi::after {
		content: "";
		background: #39237e;
	}
	
	section.message div.box div.text{
		width: 100%;
	}
	
	section.message div.box div.text p,
	section.message div.box div.text div.sign_box{
		font-size: 1.68rem;
		font-size: clamp(1.687rem, 4.68vw, 3.6rem);
		line-height: 1.85;
		letter-spacing: 0.04em;
	}
	
	section.message div.box div.text p + p{
		margin-top: 1em;
	}
	
	section.message div.box div.text div.sign_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	
	section.message div.box div.text div.sign_box p{
		display: inline-block;
		line-height: 1.4;
	}
	
	section.message div.box div.text div.sign_box p b{
		font-size: 140%;
	}
	
	section.message div.box02{
		width: 90%;
		margin: 12vw auto 0;
		position: relative;
	}
	
	section.message div.box02 dl{
		display: block;
	}
	
	section.message div.box02 dl + dl{
		margin-top: 8vw;
	}
	
	section.message div.box02 dl dt{
		width: 100%;
		font-size: 1.77rem;
		font-size: clamp(1.77rem, 4.94vw, 3.8rem);
		font-weight: 400;
		line-height: 1;
		color: #FFF;
		background: #009fe8;
		padding: 0.5em 0.5em;
		text-align: center;
	}
	
	section.message div.box02 dl dt small{
		font-size: 70%;
	}
	
	section.message div.box02 dl dd{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		font-size: 1.4rem;
		font-size: clamp(1.4rem, 3.9vw, 3.0rem);
		font-weight: 400;
		margin-top: 0.5em;
	}
	
	section.message div.box03 {
		width: 90%;
		margin: 15vw auto 0;
		background: #FFF;
		border: 0.52vw solid #efefef;
		border-radius: 20px;
		padding: 10vw 10%;
	}
	
	section.message div.box03 div.left_box{
		width: 100%;
	}
	
	section.message div.box03 div.left_box figure {
		width: 80%;
		margin: 0 auto;
	}
	
	section.message div.box03 div.right_box{
		width: 100%;
		margin-top: 10vw;
	}
	
	section.message div.box03 div.right_box div{
		position: relative;
		cursor: pointer;
		line-height: 0;
	}
	
	section.message div.box03 div.right_box div span{
		display: block;
		width: 18.8%;
		position: absolute;
		top: 31.6%;
		left: 40.6%;
		z-index: 3;
		transition:.5s all;
	}
	
	section.message div.box03 div h5 {
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 1.68rem;
		font-size: clamp(1.68rem, 4.68vw, 3.6rem);
		font-weight: 500;
		line-height: 1;
		color: #009fe8;
		text-align: center;
		margin-bottom: 1.25em;
	}
	
	section.message div.box03 div h5 span{
		display: inline-block;
		position: relative;
		padding-bottom: 1em;
	}
	
	section.message div.box03 div h5 span::after{
		content: "";
		width: 2.4em;
		height: 0.6vw;
		background: #009fe8;
		display: block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.2em);
	}
	
	section.history02 div.inner,
	section.history03 div.inner{
		padding-top: 32.4vw;
		padding-top: 32.4cqw;
		position: relative;
		background: #e9f7fd;
	}
	
	section.history02 div.inner::before,
	section.history03 div.inner::before{
		content: "";
		width: 100%;
		height: 32.4vw;
		height: 32.4cqw;
		display: block;
		background: url("../images/th100/bg_wave_top.svg") no-repeat;
		background-size: cover;
		position: absolute;
		top: -2px;
		left: 0;
		z-index: 1;
	}
	
	section.history02 div.inner div.item08 {
		width: 70%;
		margin-left: 8.18%;
	}
	
	section.history02 div.inner div.item08 div.text {
		margin-top: 0;
	}
	
	section.history02 div.inner div.item09 {
		width: 80%;
		margin-top: 10vw;
		margin-left: 20%;
	}
	
	section.history02 div.inner div.item09 div.text {
		margin-top: -1em;
	}
	
	section.history02 div.inner div.item10 {
		width: 68%;
		margin-top: 10vw;
		margin-left: 5%;
	}
	
	section.history02 div.inner div.item10 div.text {
		margin-top: 0;
	}
	
	section.history02 div.inner div.item11{
		width: 64%;
		margin-top: 5vw;
		margin-left: 36%;
	}
	
	section.history02 div.inner div.item11 div.text {
		margin-top: 1em;
	}
	
	section.history02 div.inner div.item12{
		width: 66%;
		margin-left: 0;
	}
	
	section.history02 div.inner div.item12 div.text {
		margin-top: -0.75em;
	}
	
	section.history02 div.inner div.item13{
		width: 90%;
		margin-top: -3vw;
		margin-left: 10%;
	}
	
	section.history02 div.inner div.item13 div.text {
		margin-top: -1.5em;
	}
	
	section.history03 div.inner {
        padding-bottom: 0;
    }
	
	section.history03 div.inner div.item14{
		width: 76%;
		margin-left: 8.8%;
	}
	
	section.history03 div.inner div.item15{
		width: 82%;
		margin-top: 9.7vw;
		margin-left: 18%;
	}
	
	section.history03 div.inner div.item15 div.text {
		margin-top: -0.5em;
	}
	
	section.history03 div.inner div.item16{
		width: 66.6%;
		margin-top: 4vw;
		margin-left: 0;
	}
	
	section.history03 div.inner div.item16 div.text {
		margin-top: -0.5em;
	}
	
	section.history03 div.inner div.item17{
		width: 70%;
		margin-top: 1vw;
		margin-left: 30%;
		position: relative;
		z-index: 3;
	}
	
	section.history03 div.inner div.item17 div.text {
		margin-top: -0.5em;
	}
	
	section#project {
		margin-top: 25vw;
		padding-top: 10vw;
	}
	
	section#project div.procect_inner {
		position: relative;
	}
	
	section#project div.procect_inner h2{
		width: 86%;
		position: absolute;
		top: -14vw;
		top: -14cqw;
		left: 7%;
		z-index: 3;
		line-height: 1.4;
		text-align: center;
	}
	
	section#project div.procect_inner h2 small{
		font-family: "Mrs Saint Delafield", cursive;
		font-size: 3.36rem;
		font-size: clamp(3.36rem, 9.37vw, 7.2rem);
		font-weight: 400;
		color: #a67c52;
	}
	
	section#project div.procect_inner div.bg{
		position: relative;
		z-index: 0;
		line-height: 0;
	}
	
	section#project div.procect_inner ul.contents{
		width: 70%;
		position: absolute;
		top: 30vw;
		left: 15%;
		z-index: 3;
		list-style: none;
	}
	
	section#project div.procect_inner ul.contents li{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	
	section#project div.procect_inner ul.contents li + li{
		margin-top: 2vw;
	}
	
	section#project div.procect_inner ul.contents li div.card-content{
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 1.87rem;
		font-size: clamp(1.87rem, 5.2vw, 4.0rem);
		line-height: 1.38;
		font-weight: 600;
		text-align: center;
	}
	
	section#project div.procect_inner ul.contents li div.card-content span{
		display: inline-block;
		padding-bottom: 0.7em;
		position: relative;
	}
	
	section#project div.procect_inner ul.contents li div.card-content span::after{
		content: "";
		width: 3em;
		height: 0.52vw;
		background: #a67c52;
		display: block;
		position: absolute;
		bottom: 0;
		left: calc(50% - 1.5em);
	}
	
	footer div.banner {
		width: 90%;
		height: 52vw;
		height: 52cqw;
		position: absolute;
		top: -10vw;
		top: -10cqw;
		left: 5%;
		z-index: 5;
		background: #FFF;
		border-radius: 1.56vw;
		overflow: hidden;
		box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.5);
	}
	
	footer div.banner a{
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		background: url("../images/th100/banner_sp.jpg") no-repeat;
		background-size: cover;
		color: #FFF;
	}
	
	footer div.banner a div.text h3{
		font-family: "Zen Old Mincho", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
		font-size: 2.7rem;
		font-size: clamp(2.7rem, 7.55vw, 5.8rem);
		line-height: 1;
		font-weight: 500;
		text-align: center;
		margin-bottom: 0.5em;
	}
	
	footer div.banner a div.text h3 span{
		display: inline-block;
		padding-bottom: 0.25em;
		border-bottom: 1vw solid #FFF;
	}
	
	footer div.banner a div.text p{
		font-size: 1.96rem;
		font-size: clamp(1.96rem, 5.46vw, 4.2rem);
		line-height: 1.4;
		font-weight: 400;
		letter-spacing: 0.14em;
		text-align: center;
	}
	
	.glass-item {
      width: 100%;
      list-style: none;
      transform: translateY(40px);
      transition: transform 0.8s ease;
      will-change: transform;
    }
	
	.glass-item.is-visible {
      transform: translateY(0);
    }

	.liquid-glass-card {
      position: relative;
      width: 100%;
      height: 26.4vw;
      border-radius: 2.6vw;
	  transform: translateZ(0);
      isolation: isolate;
	  background: rgba(250, 250, 250, 0.02);
      box-shadow:
        -4px 12px 20px 0 rgba(51, 51, 51, 0.22),
        inset 0px 0px 4px 2px rgba(255, 255, 255, 0.45);
    }
	
	.liquid-glass-card::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      border-radius: 2.6vw;
      box-shadow: inset 0 0 12px -4px rgba(255, 255, 255, 1);
      background-color: rgba(255, 255, 255, 0);
      pointer-events: none;
    }
	
	.liquid-glass-card::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: -1;
      border-radius: 2.6vw;
      backdrop-filter: blur(15px);
      -webkit-backdrop-filter: blur(15px);
      filter: url(#glass-distortion);
      -webkit-filter: url(#glass-distortion);
      isolation: isolate;
      pointer-events: none;
    }
	
    .card-content,
    .card-body {
      position: relative;
      z-index: 2;
    }

    /* 文字だけ少しフェード */
    .card-body {
      opacity: 0;
      transform: translateY(12px);
      transition:
        opacity 0.8s ease 0.15s,
        transform 0.8s ease 0.15s;
    }

    .glass-item.is-visible .card-body {
      opacity: 1;
      transform: translateY(0);
    }
	
	
	

	
	footer {
        padding: 52vw 0 10vw;
		background: #efefef;
		font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    }
	
	footer div.f_block {
		width: 90%;
		margin: 0 auto;
	}
	
	footer div.f_block h2{
		width: 80%;
		line-height: 0;
	}
	
	footer div.f_block p{
		font-size: 1.2rem;
		font-size: clamp(1.2rem, 3.32vw, 2.55rem);
		line-height: 1.8;
		color: #4d4d4d;
	}
	
	footer div.f_block p a{
		color: #4d4d4d;
	}
	
	footer div.f_block p:first-of-type{
		margin-top: 1em;
	}
	
}