/**************************************** コンテンツ設定 ****************************************/
html,body {font-size:0.9vw;margin:0;padding:0;background:#fff;}
body {font-family: "Roboto","Noto Sans Japanese","Helvetica",sans-serif;}
div,h1,h2,h3,h4,ul,li,dl,dt,dd,img {margin:0px; padding: 0px;}
ul {list-style: none; margin: 0px; padding:0px;}
p {margin: 0px; padding: 0px;}
a,a:visited {color: #000; text-decoration: none;}
a:hover {color: #000; text-decoration: underline;}
a img {border-style:none;}
input, button, textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
* {box-sizing:border-box;}
.text-right {text-align:right;}
.text-center {text-align:center;}
/*SP*/
@media (max-width: 896px){
	html,body {font-size:3.5vw;}
}

/*共通*/
@media (max-width: 896px){ .pc {display:none !important;} }
@media (min-width: 897px){ .sp {display:none !important;} }

/*パソコン設定*/
@media (min-width: 897px){
.col {}
.collist {display:flex; flex-wrap:wrap;}
.collist.reverse {flex-direction:row-reverse;}
.collist .inner {justify-content:space-between;}
.col .inner {float:left;}
.col .inner.right {float:right;}
.col2 .inner {width:50%;} .col3 .inner {width:33.3%;} .col4 .inner {width:25%;} .col5 .inner {width:20%;}
.col6 .inner {width:16.6%;} .col7 .inner {width:14.2%;} .col8 .inner {width:12.5%;} .col9 .inner {width:11.1%;} .col10 .inner {width:10%;}
}
section {}
.contentarea {padding:7vw 5vw;}
.content {width:65vw;max-width:100%;margin:0px auto;}
.content.wide {width:90vw;}
.contentarea h2 {font-size:3.5rem;margin-bottom:0.8em;}
.contentarea p {font-size:1.4rem;line-height:1.8em;}
.contentarea p a {font-size:1.2rem;border-radius:3rem;margin-top:2rem;}
/*SP*/
@media (max-width: 896px){
	.contentarea {padding:5vh 5vw;}
	.content {width:100%;}
	.contentarea h2 {font-size:2.4rem;}
	.contentarea p {font-size:1.2rem;}
	.contentarea p a {font-size:1.2rem;}
}
a.btn, span.btn {font-size:1.0rem;padding:1em 3em;border-radius:2rem;
	display:inline-block;text-decoration:none;background:#fff;border:solid #000 2px;color:#000;cursor:pointer;}
a.btn:hover, span.btn:hover {font-weight:bold;background:#000;color:#fff;border:solid #fff 2px;text-decoration:none;}

/*inview設定*/
.inview {opacity:0;transform:translateY(5vw);}
.inview.on {opacity:1;transform:translateY(0px);transition:1s;}
.clear {clear:both; }

/**************************************** ヘッダー ****************************************/
.headerarea {position:fixed;top:0px;left:0px;width:100%;height:10vh;z-index:7000;background:rgba(255,255,255,0.75);
 backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);box-shadow:0 1px 2px rgba(0,0,0,0.1);}

.logoarea {position:absolute;top:0vh;left:3vw;}
.logoarea img {height:10vh;width:35vw;object-fit:contain;object-position:center left;}

.barwrap {display:none;}

.menu {position:fixed;top:0px;right:0px;width:auto;height:10vh;line-height:10vh;padding:0px;z-index:7100;}
.menu .menulist {display:flex;flex-wrap:wrap;}
.menu .menulist a {font-size:1.0vw;line-height:1.5em;height:10vh;line-height:10vh;font-weight:bold;color:#000;padding:0 1.5rem;display:block;}
.menu .menulist a:hover {text-decoration:none;border-bottom:solid #000 3px;}
.menu .menulist a.attention01 {background:#39a8e1;color:#fff;padding:0 2.5rem;}
.menu .menulist a.attention02 {background:#f39801;color:#fff;padding:0 2.5rem;}
.menu .menulist a.attention01:hover {color:#39a8e1;background:#fff;border:none;}
.menu .menulist a.attention02:hover {color:#f39801;background:#fff;border:none;}

/*SP*/
@media (max-width: 896px){
.logoarea img {width:68vw;}
	.menu {position:fixed;top:0px;left:0px;width:100vw;height:100vh;background:#fff;transform:translateX(150vw) rotateZ(18deg);}
	.menu.on {transform:translateX(0vw) rotateZ(0deg);transition:0.4s;}
	.menu.out {transform:translateX(150vw) rotateZ(18deg);transition:0.3s;}
	.menu .menulist {padding:15vh 10vw 10vh 10vw;display:block;}
	.menu .menulist a {font-size:1.4rem;line-height:2.5em;height:auto;margin-bottom:2rem;}
	.menu .menulist a.attention01 {display:block;text-align:center;width:100%;padding:0.8em 0;margin-top:5rem;margin-bottom:0.3rem;}
	.menu .menulist a.attention02 {display:block;text-align:center;width:100%;padding:0.8em 0;}

.barwrap {position:fixed;top:1vh;right:1vh;display:block;height:8vh;width:8vh;vertical-align:middle;z-index:8000;}
.barwrap.on {transition:1s;}
.barwrap.out {transition:0.3s;}
.barwrap .bar {position:absolute;background:#000;width:5vh;height:1px;}
.barwrap .bar.bar01 {top:4vh;left:2vh;}
.barwrap .bar.bar02 {top:5vh;left:1vh;}
.barwrap.on .bar {transition:1s;}
.barwrap.on .bar.bar01 {transform:translateX(-50%) translateY(-50%) rotateZ(45deg);top:50%;left:50%;}
.barwrap.on .bar.bar02 {transform:translateX(-50%) translateY(-50%) rotateZ(-225deg);top:50%;left:50%;}
.barwrap.out .bar {transition:0.5s;}
.barwrap.out .bar.bar01 {transform:translateX(0%) translateY(0%) rotateZ(0deg);top:4vh;left:2vh;}
.barwrap.out .bar.bar02 {transform:translateX(0%) translateY(0%) rotateZ(0deg);top:5vh;left:1vh;}
}

/**************************************** フッター ****************************************/
/* cmn-1.jpg : フッター背景画像 */
.footerarea {padding:7vw 0px 0px 0px;background:#1a1a2e url(../img/cmn/bg_footer.jpg) no-repeat center center;background-size:cover;}

.contactarea {text-align:center;padding-bottom:7vw;}
.contactarea h2 {color:#fff;font-size:3.5rem;margin-bottom:0.8em;}
.contactarea p {color:#fff;font-size:1.4rem;line-height:2.2em;}
.contactarea a.btn {font-size:1.4rem;border-radius:3em;}

/*SP*/
@media (max-width: 896px){
	.contactarea {padding:10vh 10vw;}
	.contactarea h2 {font-size:2.1rem;margin-bottom:3rem;}
	.contactarea p {font-size:1.2rem;text-align:left;}
	.contactarea a.btn {font-size:1.2rem;}
}

.footer {position:relative;padding:6vw;text-align:left;}
.footermenu {padding-bottom:3rem;}
.footermenu a {font-size:1.0rem;line-height:2em;color:#fff;display:inline-block;padding-right:1rem;}
.copyright {font-size:1.0rem;color:#fff;}
.copyright p {color:#fff;font-size:1.0rem;}

/*SP*/
@media (max-width: 896px){
	.footermenu {text-align:left;}
	.footermenu a {display:block;border-bottom:solid #333 1px;padding:12px;}
	.footermenu br {display:none;}
}