@charset "UTF-8";

/* ---------------------------------------------------------------------------
  ★共通
--------------------------------------------------------------------------- */
:root{
  scroll-padding-top: 0px;
}
html {font-size: 62.5%;scroll-behavior: smooth;}
body{  
  font-size: 1.6rem;
}
object {pointer-events: none;}
.sp {display: none !important;}
a[href^="tel:"] {pointer-events: none;}
a {
    text-decoration: none;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.pcFlex{display: flex;}
.pcFlex.half{
 justify-content: space-between;
}
.pcFlex.half >*{
 width: 47.6%;
}
.img_r {overflow: hidden;}
.img_r>img {float: right;
    width: 33%;
    margin-left: 15px;
    margin-bottom: 15px;
}
p,li,dt,dd,th,td,input{
  font-size: 1.6rem;
}
h1,h2,h3,h4,h5,h6 {
  font-size: 1.6rem;
 text-align: center;
}



/*
　テキスト
========================================== */
.note{
  font-size: 1.2rem;
}

/*
　ボタン,リンク
========================================== */

.linkListWrap{
	flex-wrap: wrap;
	gap: 20px;
}
.linkListWrap li{
	width: calc((100% - 20px)/2);
}


/*-- table --*/
.basicTable >dt,
.basicTable >div>dt{
	padding: 15px 2.5%;
	width: 23%;
}
.basicTable >dd,
.basicTable >div>dd{
	padding: 15px 2.5%;
	width: 77%;
}
.basicTable >dt:last-of-type{
	border-bottom: none;
}
 .basicTable >dd:last-of-type{
	border-bottom: none;
}

table.basicTable thead th{
	font-size: 1.8rem;
}

/* =======================================
  レイアウト
========================================== */
body{
	position: relative;
  display: grid;
  grid-template-columns: 1fr 375px 1fr;
  min-height: 100vh;
}
#sideHeader{
	position: sticky;
	top: 0;
	height: 100vh;
	overflow-y: auto;
	
	display: flex;
 flex-flow: column;
 align-items:flex-end;
 justify-content: center;
}
#sideNav{
	position: sticky;
	top: 0;
	height: 100vh;
	overflow-y: auto;

	display: flex;
 flex-flow: row wrap;
 align-content:flex-end;
	justify-content:flex-start;
	align-items: flex-end;
}
#wrapper{
	width: var(--widthWrapper);
	margin: 0 auto;
}
/* =======================================
	sideHeader
========================================== */
#sideHeader{
 background: url("../images/side_bg_left_top.png") no-repeat left top//*auto 385px*/100% auto,
   url("../images/side_bg_left_btm.png") no-repeat right min(5.57vw,78px) bottom/519px auto;
	padding: 6.54vh min(4.64vw,65px) 0 0;
}
#sideHeader .logo{
 margin-bottom: 36px;
}
/* =======================================
	sideNav
========================================== */
#sideNav{
 background: url("../images/side_bg_right_top.png") no-repeat right top//*auto 299px*/100% auto,
   url("../images/side_bg_right_btm.png") no-repeat left min(3.64vw,51px) bottom/475px auto  ;
	padding: 0 0 10.9vh 0;
}
#sideNav ul{
 position: relative;
 min-height: 226px;
 text-align: center;
}
#sideNav ul::before{
 content: "";
 display: block;
 background: #9A7138;
 width: 6.6px;
 height: 220px;
 position: absolute;
 top: 5px;
 left: 50%;
 transform: translate(-50%, 0);
 z-index: -1;
}

#sideNav ul li a{
 display: inline-grid;
 place-content: center;
 margin-bottom: 5px;
 color: #fff;
 font-weight: 700;
 line-height: 2;
}
#sideNav ul li:nth-of-type(1) a{
 background: url("../images/side_nav_bg01.svg") no-repeat left top/100% auto;
 width: 150px;
 height: 52px;
}
#sideNav ul li:nth-of-type(2) a{
 position: relative;
 margin-bottom: 3px;
 width: 176px;
 height: 42px;
transform: rotate(3.5deg);
 z-index: 1;
}
#sideNav ul li:nth-of-type(2) a::before{
 content: "";
 display: block;
 background: url("../images/side_nav_bg02.svg") no-repeat left top/100% 100%;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
transform: rotate(-3.5deg);
}
#sideNav ul li:nth-of-type(3) a{
 background:#B98945;
 margin-bottom: 8px;
 min-width: 108px;
 padding: 0 3px 0 4px;
transform: rotate(-4.4deg);
 line-height: 1.65;
}
#sideNav ul li:nth-of-type(4){
 text-align: right;
}
#sideNav ul li:nth-of-type(4) a{
 background: url("../images/side_nav_bg04.svg") no-repeat left top/100% auto;
 width: 155px;
 height: 45px;
 padding-right: 15px;
}
#sideNav .nav01{
 margin-left: min(3.64vw,51px);
 margin-bottom: 30px;
}
#sideNav .nav02{
 margin-left: min(2.42vw,34px);
}
#sideNav .nav02 li:nth-of-type(2) a{
 width: 147px;
 height: 43px;
transform: rotate(4.55deg);
}
#sideNav .nav02 li:nth-of-type(2) a::before{
 background: url("../images/side_nav_bg06.svg") no-repeat left top/100% 100%;
transform: rotate(-4.55deg);
}
#sideNav .nav02 li:nth-of-type(4) a{
 margin-left: 6px;
}

#sideNav ul li a:hover,
#sideNav .nav02 li:nth-of-type(2) a:hover{
 transform:scale(1.1);
 opacity: 1;
}

#sideNav p{
 width: 100%;
}
#sideNav p a{
 position: relative;
 display: block;
 padding: 47px 0 0 30px;
 width: 233px;
 height: 233px;
 margin: 0 0 0 84px;
}
#sideNav p a::before{
 content: "";
 display: block;
 background: url("../images/side_btn_bg.svg") no-repeat left top/100% 100%;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
  animation: rotation 15s linear infinite;
}
#sideNav p a::after{
 content: "";
 display: block;
 background: url("../images/side_btn_pct.png") no-repeat left top/100% auto;
 width: 108px;
 height: 77px;
 position: absolute;
 right: -17px;
 bottom: -30px;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


/* =======================================
	footer/#footBottom
========================================== */

footer a:hover{
 opacity: .7;
}


/* =======================================
 common
========================================== */

/* =======================================
	top PC
========================================== */

/*		#mv PC
-----------------------------*/
#mvTxt{
 top: 95px;
}
#mvTxt::before{
 width:81px ;
 height: 39px;
 top: -32px;
}
#mvTxt::after{
 top: 71px;
}

/* =======================================
	PC
========================================== */


/* =======================================
	form
========================================== */
.formArea .basicTable input[type=text],
.formArea .basicTable input[type=email],
.formArea .basicTable input[type=tel],
.formArea .basicTable select{
	padding: 8px;
	width:100%;
}
.formArea .basicTable textarea{
	padding: 8px;
	width: 100% !important;
}
.confirm {
		margin-top: 40px;
}


/* =======================================
	thanks
========================================== */

#thanks{
}

#thanks p{
  font-size: 1.8rem;
}

/* =======================================
	privacypolicy
========================================== */
#privacyPolicy{
	margin-top: 50px;
}
.policyBox{
	padding: 20px 2%;
}
.policyBox .h5Tit{
	margin-top: 40px;
}


