﻿/*
Theme Name:IVP特設サイト
Tema URI:https://ivp.valuable-style.co.jp
download/
Description: 
Author: 
Author URI:
Version: 1.0
*/

html {
  height: 100%;
}

body {
  height: 100%;
  position: relative;
}

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

.soon {
  width: 80%;
  height: auto;
  transform: translate(-50%,-50%);
  position: absolute;
  top: 50%;
  left: 50%;
	max-width: 80rem;
}


/*====================================

RESET CSS

====================================*/

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}



/*====================================

MAIN CSS

====================================*/

.main {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 375px;
}

body {
	font-family: 'Noto Sans JP', 'Roboto', sans-serif;
  font-weight: 400;
  color: #333;
  margin: 0;
}

a {
	text-decoration:none;
	color: #333;
	cursor: pointer;
}

a:hover {
	opacity: 0.7;
	filter:alpha(opacity=70);	
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
}



/* == COMMON == */

html {
  font-size: 62.5%;
}

img {
  display: block;
  border: none;
  aspect-ratio: 3/2 auto;
  width: 100%;
  height: auto;
}

svg {
  width: 100%;
  height: auto;
  overflow: visible;
}

.ff--en {
    font-family: 'Roboto';
}


/*====================================

DRAWER CSS

====================================*/



/*　ドロワーメニュー　Close状態　*/

.drawer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition:ease .5s;
	transition: ease .5s;
	z-index: 10;
}
@media (min-width: 768px) {
  .drawer {
    display: none;
  }
}

/* ドロワーメニュー　開閉ボタン */


.drawerbtn {
	position: absolute;
	top: 0px;
	right: -50px;
	width: 50px;
	height: 50px;
	-webkit-transition: ease .5s;
	transition: ease .5s;
	cursor: pointer;
	align-items: flex-end;
	display: flex;
	justify-content: center;
	z-index: 10;
}

/* hambarg */

.hambarg {
	position: absolute;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	height: 1px;
	width: 30px;
	background-color: #111;
	-webkit-transition: ease .5s;
	transition: ease .5s;
}
.hambarg:nth-child(1) {
	top: 30%;
	left: 50%;
}
.hambarg:nth-child(2) {
	top: 50%;
	left: 50%;
}
.hambarg:nth-child(3) {
	top: 70%;
	left: 50%;
}

/*
.drawerbtn::after {
	content: "MENU";
  font-size: 1rem;
}

.drawerbtn.action:after {
	content: "CLOSE";
  font-size: 1rem;
}
*/

/* ドロワーメニューをOPENにする */

.drawer.action {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* ボタンをドロワーメニュー内に表示 */

.drawerbtn.action {
	right: 0;
}

/* ハンバーガーボタンを×に変える */
 
	
.drawerbtn.action span.hambarg:nth-child(1) {
	top: 50%;
	-webkit-transform: translate(-50%,-50%) rotate(45deg);
	transform: translate(-50%,-50%) rotate(45deg);
	background-color: #333;
}

.drawerbtn.action span.hambarg:nth-child(2) {
	top: 50%;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	display: none;
}

.drawerbtn.action span.hambarg:nth-child(3) {
	top: 50%;
	-webkit-transform: translate(-50%,-50%) rotate(-45deg);
	transform: translate(-50%,-50%) rotate(-45deg);
	background-color: #333;
}



/* TOPへ戻るボタン */

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
  background: #fff;
  text-decoration: none;
  color: #111;
  width: 8rem;
  padding: 0.8rem;
  text-align: center;
  display: block;
  border-radius: 50%;
  border: 0.4rem solid #caa14f;
  box-sizing: border-box;
}
#page-top a:hover {
    opacity: 1;
}


/* WIDTH */

.max--1440 {
  max-width: 144rem;
  margin: 0 auto;
}

.max--300 {
  max-width: 30rem;
  margin: 0 auto;
}

/* SIZE */

.size--1618 {
  width: 1.6rem;
  height: 1.6rem;
}
.size--1820 {
  width: 1.8rem;
  height: 1.8rem;
}
@media (min-width: 375px) {
  .size--1618 {
    width: calc(1.6rem + ( 1.8 - 1.6 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
    height: calc(1.6rem + ( 1.8 - 1.6 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .size--1820 {
    width: calc(1.8rem + ( 2 - 1.8 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
    height: calc(1.8rem + ( 2 - 1.8 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
}
@media (min-width: 1440px) {
  .size--1618 {
    width: 1.8rem;
    height: 1.8rem;
  }
  .size--1820 {
    width: 2rem;
    height: 2rem;
  }
}

/* DISPLAY */

.d__flex {
  display: flex;
  flex-wrap: wrap;
}

/* FLEX */

.flex__nowarp {
  flex-wrap: nowrap;
}

.j__content--start {
  justify-content: start;
}
.j__content--center {
  justify-content: center;
}
.j__content--end {
  justify-content: end;
}
.j__content--space {
  justify-content: space-between;
}

.a__item--start {
  align-items: start;
}
.a__item--center {
  align-items: center;
}
.a__item--end {
  align-items: end;
}
.flex__dir--rev {
  flex-direction: column-reverse;
}
@media (min-width: 768px) {
  .flex__dir--rev {
    flex-direction: unset;
  }
}

/* GAP */

.gap--08 {
	gap: 0.8rem;
}
.gap--16 {
	gap: 1.6rem;
}
.gap__x--08 {
	column-gap: 0.8rem;
}
.gap__x--16 {
	column-gap: 1.6rem;
}
.gap__x--32 {
	column-gap: 3.2rem;
}

.gap__y--16 {
	row-gap: 1.6rem;
}

.gap__x--0816 {
	column-gap: 0.8rem;
}
.gap__x--1624 {
	column-gap: 1.6rem;
}
.gap__x--2432 {
	column-gap: 2.4rem;
}
.gap__x--3248 {
	column-gap: 3.2rem;
}

.gap__y--0816 {
	row-gap: 0.8rem;
}
.gap__y--1624 {
	row-gap: 1.6rem;
}
.gap__y--2432 {
    row-gap: 2.4rem;
}
.gap__y--3248 {
	row-gap: 3.2rem;
}

.gap__col--122 {
	gap: 1.6rem;
}

@media screen and (min-width: 375px) {
	.gap__x--0816 {
		column-gap: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
	}
	.gap__x--1624 {
		column-gap: calc(1.6rem + (2.4 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
	}
	.gap__x--2432 {
		column-gap: calc(2.4rem + (3.2 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
	}
	.gap__x--3248 {
		column-gap: calc(3.2rem + (4.8 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
	}

	.gap__y--0816 {
		row-gap: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
	}
	.gap__y--1624 {
		row-gap: calc(1.6rem + (2.4 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
	}
    .gap__y--2432 {
        row-gap: calc(2.4rem + (3.2 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
    }
	.gap__y--3248 {
		row-gap: calc(3.2rem + (4.8 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
	}

}
@media screen and (min-width: 768px) {
	.gap__col--122 {
		gap: calc(1.6rem + (3.2 - 1.6) *((100vw - 76.8rem) / (144 - 76.8)));
	}	
}
@media screen and (min-width: 1440px) {
	.gap__x--0816 {
		column-gap: 1.6rem;
	}
	.gap__x--1624 {
		column-gap: 2.4rem;
	}
	.gap__x--2432 {
		column-gap: 3.2rem;
	}
	.gap__x--3248 {
		column-gap: 4.8rem;
	}

	.gap__y--0816 {
		row-gap: 1.6rem;
	}
	.gap__y--1624 {
		row-gap: 2.4rem;
	}
    .gap__y--2432 {
		row-gap: 3.2rem;
	}
	.gap__y--3248 {
		row-gap: 4.8rem;
	}

	.gap__col--122 {
		gap: 3.2rem;
	}
}

/* COLUMN */

.col__112--110 {
  flex: 100%;
}
.col__122--110 {
  flex: 100%;
}
@media (min-width: 768px) {
  .col__122--110 {
    flex: 1 1 0;
  }
}
@media (min-width: 1080px) {
  .col__112--110 {
    flex: 1 1 0;
  }
}

/* BR */

.br--sp {
	display: inline;
}
.br--tb {
	display: none;
}
.br--pc {
	display: none;
}

@media screen and (min-width: 596px) {
	.br--sp {
		display: none;
	}
	.br--tb {
		display: inline;
	}
}
@media screen and (min-width: 768px) {
	.br--tb {
		display: none;
	}
	.br--pc {
		display: inline;
	}
}

/* POSITION */

.position--r {
	position: relative;
}

.position--a {
	position: absolute;
}

.ccc {
	text-align: center;
}

.lll {
	text-align: left;
}

@media screen and (min-width: 768px) {

}
@media screen and (min-width: 1080px) {

}


/* FONT */

.lh--0 {
  line-height: 1 !important;
}


/* FONT WEIGHT */

.fw--1 {
  font-weight: 100;
}

.fw--4 {
  font-weight: 400;
}

.fw--6 {
  font-weight: 600;
}

/* FONT SIZE */

.fs--2444 {
  font-size: 2.4rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.fs--2032 {
  font-size: 2rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.fs--1926 {
  font-size: 1.9rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.fs--1820 {
  font-size: 1.8rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.fs--1618 {
  font-size: 1.6rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.form--label,
.fs--1416 {
  font-size: 1.4rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.content p {
  font-size: 1.4rem;
  line-height: 1.5;
}
.excerpt__item p {
  font-size: 1.4rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
  margin: 0;
}
.fs--1314 {
  font-size: 1.3rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
.fs--10 {
  font-size: 1rem;
  line-height: 1.5;
  padding-bottom: 0.2rem;
}
@media (min-width: 375px) {
  .fs--2444 {
    font-size: calc(2.4rem + ( 4.4 - 2.4 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .fs--2032 {
    font-size: calc(2rem + ( 3.2 - 2 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .fs--1926 {
    font-size: calc(1.9rem + ( 2.6 - 1.9 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .fs--1820 {
    font-size: calc(1.8rem + ( 2 - 1.8 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .fs--1618 {
    font-size: calc(1.6rem + ( 1.8 - 1.6 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .form--label,
  .fs--1416,
  .content p,
  .excerpt__item p {
    font-size: calc(1.4rem + ( 1.6 - 1.4 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
  .fs--1314 {
    font-size: calc(1.3rem + ( 1.4 - 1.3 ) * ((100vw - 37.5rem) / ( 144 - 37.5 )));
  }
}
@media (min-width: 1440px) {
  .fs--2444 {
    font-size: 4.4rem
  }
  .fs--2032 {
    font-size: 3.2rem
  }
  .fs--1926 {
    font-size: 2.6rem;
  }
  .fs--1820 {
    font-size: 2rem;
  }
  .fs--1618 {
    font-size: 1.8rem;
  }
  .form--label,
  .content p,
  .fs--1416,
  .excerpt__item p {
    font-size: 1.6rem;
  }
  .fs--1314 {
    font-size: 1.4rem;
  }
}

/* PADDING */

.px--main {
  box-sizing: border-box;
  padding-left: 1rem;
  padding-right: 1rem;
}
.px--sidebar {
  box-sizing: border-box;
  padding-left: 1rem;
  padding-right: 1rem;
}
.px--2440 {
  box-sizing: border-box;
  padding-left: 2.4rem;
  padding-right: 2.4rem;
}
.px--16 {
  box-sizing: border-box;
  padding-left:1.6rem;
  padding-right: 1.6rem;
}
.px--08 {
  box-sizing: border-box;
  padding-left:0.8rem;
  padding-right: 0.8rem;
}

.py--2440 {
  box-sizing: border-box;
  padding-top: 2.4rem;
  padding-bottom: 2.4rem;
}
.py--16 {
  box-sizing: border-box;
  padding-top: 1.6rem;
  padding-bottom: 1.6rem;
}
.py--08 {
  box-sizing: border-box;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}

.p--0 {
  padding: 0;
}

.pt--32 {
  padding-top: 3.2rem;
}

.pb--32 {
  padding-bottom: 3.2rem;
}

.pt--3264 {
  padding-top: 3.2rem;
}
.pt--2448 {
  padding-top: 2.4rem;
}
.pt--1632 {
  padding-top: 1.6rem;
}
.pt--0816 {
  padding-top: 0.8rem;
}

.pb--3264 {
  padding-bottom: 3.2rem;
}
.pb--2448 {
  padding-bottom: 2.4rem;
}
.pb--1632 {
  padding-bottom: 1.6rem;
}
.pb--0816 {
  padding-bottom: 0.8rem;
}



@media screen and (min-width: 375px) {
  .px--2440 {
    padding-left: calc(2.4rem + (4 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
    padding-right: calc(2.4rem + (4 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .py--2440 {
    padding-top: calc(2.4rem + (4 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
    padding-bottom: calc(2.4rem + (4 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }

  .pt--3264 {
    padding-top: calc(3.2rem + (6.4 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pt--2448 {
    padding-top: calc(2.4rem + (4.8 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pt--1632 {
    padding-top: calc(1.6rem + (3.2 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pt--0816 {
    padding-top: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
  }

  .pb--3264 {
    padding-bottom: calc(3.2rem + (6.4 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pb--2448 {
    padding-bottom: calc(2.4rem + (4.8 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pb--1632 {
    padding-bottom: calc(1.6rem + (3.2 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .pb--0816 {
    padding-bottom: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
  }
}
@media screen and (min-width: 768px) {
  .px--main {
    padding-left: calc(2.4rem + (4 - 2.4) *((100vw - 76.8rem) / (144 - 76.8)));
    padding-right: calc(2.4rem + (4 - 2.4) *((100vw - 76.8rem) / (144 - 76.8)));
  }
}
@media screen and (min-width: 1440px) {
	.px--main {
    padding-left: 4rem;
    padding-right: 4rem;
  }
  .px--2440 {
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .py--2440 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .pt--3264 {
    padding-top: 6.4rem;
  }
  .pt--2448 {
    padding-top: 4.8rem;
  }
  .pt--1632 {
    padding-top: 3.2rem;
  }
  .pt--0816 {
    padding-top: 1.6rem;
  }

  .pb--3264 {
    padding-bottom: 6.4rem;
  }
  .pb--2448 {
    padding-bottom: 4.8rem;
  }
  .pb--1632 {
    padding-bottom: 3.2rem;
  }
  .pb--0816 {
    padding-bottom: 1.6rem;
  }

}

.pl--04 {
	padding-left: 0.4rem;
}

.pr--08 {
  padding-right: 0.8rem;
}




/* MARGIN */

.m--0 {
  margin: 0;
}
.mt--0 {
  margin-top: 0;
}
.mb--0 {
  margin-bottom: 0;
}

.mt--3264 {
  margin-top: 3.2rem;
}
.mt--2448 {
  margin-top: 2.4rem;
}
.mt--1632 {
  margin-top: 1.6rem;
}
.mt--0816 {
  margin-top: 0.8rem;
}

.mb--3264 {
  margin-bottom: 3.2rem;
}
.mb--2448 {
  margin-bottom: 2.4rem;
}
.mb--1632 {
  margin-bottom: 1.6rem;
}
.mb--0816 {
  margin-bottom: 0.8rem;
}
@media screen and (min-width: 375px) {
  .mt--3264 {
    margin-top: calc(3.2rem + (6.4 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mt--2448 {
    margin-top: calc(2.4rem + (4.8 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mt--1632 {
    margin-top: calc(1.6rem + (3.2 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mt--0816 {
    margin-top: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
  }

  .mb--3264 {
    margin-bottom: calc(3.2rem + (6.4 - 3.2) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mb--2448 {
    margin-bottom: calc(2.4rem + (4.8 - 2.4) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mb--1632 {
    margin-bottom: calc(1.6rem + (3.2 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
  }
  .mb--0816 {
    margin-bottom: calc(0.8rem + (1.6 - 0.8) *((100vw - 37.5rem) / (144 - 37.5)));
  }
}
@media screen and (min-width: 1440px) {
  .mt--3264 {
    margin-top: 6.4rem;
  }
  .mt--2448 {
    margin-top: 4.8rem;
  }
  .mt--1632 {
    margin-top: 3.2rem;
  }
  .mt--0816 {
    margin-top: 1.6rem;
  }

  .mb--3264 {
    margin-bottom: 6.4rem;
  }
  .mb--2448 {
    margin-bottom: 4.8rem;
  }
  .mb--1632 {
    margin-bottom: 3.2rem;
  }
  .mb--0816 {
    margin-bottom: 1.6rem;
  }
}

/* COLOR */

.fc--fff {
  color: #fff;
}

.fc--aaa {
  color: #aaa;
}

.fc--og {
  color: #e9321a;
}

.fc--main {
  color: #caa14f;
}

.bc--333 {
  background-color: #333;
}

.bc--fff {
  background-color: #fff;
}

.bc--key {
  background-color: #bd8923;
}

.bc--main {
  background-color: #caa14f;
}

.bc--sub {
  background-color: #eee9e2;
}

.bc--back {
  background-color: #f7f5f2;
}

.bc--og {
  background-color: #e9321a;
}

.fill--fff {
  fill: #fff;
}

.fill--main {
  fill: #caa14f;
}

.fill--og {
  fill: #e9321a;
}

.fill--green {
  fill: #3cb371;
}


/* LIST */

.list--none {
  list-style-type: none;
}

/* BUTTON */

/*
CTA
*/
.btn__cta--border-og {
  display: block;
  width: 60%;
  min-width: 30rem;
  margin: 0 auto;
}
.btn__cta--border-og a {
  border: 0.2rem solid #e9321a;
  display: flex;
  height: 6rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.8rem;
  background-color: #FFF3E5;
}
/*
GLAYOUT
*/
.btn__glayout {
  display: block;
  width: 60%;
  min-width: 30rem;
  margin: 0 auto;
}
.btn__glayout--inner {
  border: 0.2rem solid #aaa;
  display: flex;
  height: 6rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.8rem;
  background-color: #fefefe;
}
.btn__glayout--inner:hover {
  cursor: not-allowed;
}
/*
PAGE LINK
*/
.btn__page-link {
  display: inline-block;
  border-radius: 0.8rem;
  overflow: hidden;
}
.btn__page-link a {
  padding: 0.8rem 3.2rem;
  display: flex;
  color: #fff;
}

/* BORDER */

.border__r--24 {
  border-radius: 2.4rem;
}
.border__r--8 {
  border-radius: 0.8rem;
}

.border__main--01 {
  border: 0.1rem solid #caa14f
}

/*====================================

HEADER

====================================*/

.header__contents {
  width: 100%;
  height: 5rem;
  justify-content: center;
}
@media (min-width: 768px) {
  .header__contents {
    height: 8rem;
    justify-content: space-between;
  }
}


/* LOGO */

.logo__disc--header {
  font-size: 1rem;
  padding-bottom: 0.1rem;
}

.logo__type--header {
  font-size: 1.8rem;
}
@media (min-width: 768px) {
  .logo__wrap--header {
    margin-left: 4rem;
  }
  .logo__disc--header {
    font-size: 1.4rem;
    padding-bottom: 0.2rem;
  }
  .logo__type--header {
    font-size: 2.4rem;
  }
}


/* UTILITY MENU */

.utility__wrap--pc {
  display: none;
}

.utility__item {
  flex: 1 1 0;
}

.utility__item.border--x {
  border-left: 0.1rem solid #eee9e2;
  border-right: 0.1rem solid #eee9e2;
}

.utility__item--icon {
  height: 4rem;
}

.utility__item--icon img {
  width: auto;
  height: 100%;
}

.utility__item--icon svg {
  width: auto;
  height: 100%;
}

@media screen and (min-width: 768px) {
  .utility__wrap--pc {
    display: inline-block;
  }
  .utility__item {
    width: 12rem;
  }
}


/* DW CONTENTS */

.dw__header {
  width: 100%;
  height: 5rem;
  border-bottom: 0.1rem solid #eee9e2;
}


/* GLOBAL MENU */

.global__menu li {
  
  margin-bottom: 1.8rem;
}

.global__menu li:last-child {
  margin-bottom: 0;
}

.global__menu li a {
  display: flex;
  width: 100%;
  height: 5.6rem;
  align-items: center;
  justify-content: center;
  background-color: #caa14f;
  border-radius: 5.6rem;
  border: 0.3rem solid #fff;
  box-sizing: border-box;
}



/*====================================

COLUMN設定

====================================*/

.column__body {
  width: 100%;
}
.left__sidebar {
  display: none;
}
.main__body {
  width: 100%;
  border-top: 0.1rem solid #f7f5f2;
}
.right__sidebar {
  width: 100%;
}

@media screen and (min-width: 768px) {

  .column__body {
    width: 76rem;
  }
  .left__sidebar {
    display: block;
    width: 24rem;
  }
  .main__body {
    width: 52rem;
  }

}

@media screen and (min-width: 1000px) {
  .column__body {
    width: calc(100rem + ( 144 - 100 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
  .left__sidebar {
    width: calc(26rem + ( 34 - 26 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
  .main__body {
    width: calc(48rem + ( 76 - 48 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
  .right__sidebar {
    width: calc(26rem + ( 34 - 26 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
}

@media screen and (min-width: 1440px) {
  .column__body {
    width: 144rem;
  }
  .left__sidebar {
    width: 34rem;
  }
  .main__body {
    width: 76rem;
  }
  .right__sidebar {
    width: 34rem;
  }
}


/* STICKY設定 */

.left__sidebar,
.right__sidebar {
  position: relative;
}

.side-contents.stop {
  position: absolute;
  top: auto;
  bottom: 8rem;
}


.right__sidebar--dis-pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .side-contents.sticky {
    position: fixed;
    top: 0;
    width: 24rem;
  }
	.side-contents.stop {
    width: 24rem;
  }
}
@media screen and (min-width: 1000px) {
  .right__sidebar--dis-pc {
    display: block;
  }
  .side-contents.sticky {
    width: calc(26rem + ( 34 - 26 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
	.side-contents.stop {
    width: calc(26rem + ( 34 - 26 ) * ((100vw - 100rem) / ( 144 - 100 )));
  }
}

@media screen and (min-width: 1440px) {
  .side-contents.sticky {
    width: 34rem;
  }
	.side-contents.stop {
    width: 34rem;
  }
}

/*====================================

MAIN BODY

====================================*/

/* PAGE TITLE */

.page-title::after {
  content: "";
  display: block;
  width: 4rem;
  border-bottom: 0.4rem solid #cdd0d7;
  margin: 0 auto;
  padding-top: 1.6rem;
}
@media screen and (min-width: 375px) {
  .page-title::after {
    width: calc(4rem + (6 - 4) *((100vw - 37.5rem) / (144 - 37.5)));
    padding-top: calc(1.6rem + (2.4 - 1.6) *((100vw - 37.5rem) / (144 - 37.5)));
  }
}
@media screen and (min-width: 1440px) {
  .page-title::after {
    width: 6rem;
    padding-top: 2.4rem;
  }
}


/* 見逃し配信 */

.learn__count--item {
  flex: 1 1 0;
}


/* INFORMATION */

.info__item {
  width: 100%;
}

.category__icon--brown {
  border-radius: 2.4rem;
  overflow: hidden;
}
.category__icon--brown a {
  display: block;
  padding: 0 0.8rem;
  color: #fff;
}
.info__item--link {
  text-align: right;
}
.info__item--link a {
  display: inline-block;
}

/* OVERVIEW */

.col__overview--item {
  width: 100%;
  border-bottom: 0.1rem solid #eee9e2;
}

.col__overview--index {
  width: 20%;
  min-width: 7rem;
}

.col__overview--access,
.col__overview--access-item {
  width: 100%;
}

/* RIGHT SIDEBAR ITEM */

.r-sidebar__item--mobile {
  width: calc(50% - 0.4rem);
}
@media screen and (min-width: 1000px) {
  .r-sidebar__item--mobile {
    display: none;
  }
}


/* 背景生成用 */

.bg-pings {
  position: fixed;
  inset: 0;
  z-index: -1; /* 背景に回す */
  pointer-events: none;
  overflow: hidden;
}

.bg-ping {
  position: absolute;
  width: 20rem;
  height: 20rem;
  background-image: url("images/bg/bg_gra-002.png");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.15; /* お好みで */
}



/*====================================

SIDEBAR

====================================*/

.r-sidebar__item {
  box-sizing: border-box;
  padding-right: 1rem;
}



/*====================================

FOOTER

====================================*/

.footer__item--border {
  border-bottom: 0.1rem solid #fff;
}

@media screen and (min-width: 375px) {
  .footer__inner {
    box-sizing: border-box;
    padding: 0 1rem;
  }
}
@media screen and (min-width: 768px) {
  .footer__inner {
    padding: 0 4rem;
  }
}
@media screen and (min-width: 1440px) {

}


/*====================================

PAGE

====================================*/

hr {
  border-top: 0.1rem solid #cdd0d7 !important;
}

.link--text,
.link--text a {
  text-decoration: underline;
  color: #007cba;
}

/*====================================

ARCHIVE

====================================*/

/* PAGENATION */

.nav-links {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 0 1rem;
}

.page-numbers {
  display: flex;
  width: 3rem;
  height: 2.8rem;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border: 0.1rem solid #caa14f;
  color: #caa14f;
  border-radius: 50%;
  padding-bottom: 0.2rem;
}

.prev.page-numbers,
.next.page-numbers {
  display: flex;
  width: auto;
  height: auto;
  border: none;
  background-color: #fff;
  color: #333;
}

.page-numbers.dots {
  border: none;
  width: auto;
  background-color: #fff;
  color: #333;
  margin-top: 0.1rem;
}

.page-numbers.current {
  border: 0.1rem solid #ddd;
  color: #ddd;
  background-color: #fff;
}

.archive-pagenation__arrow {
  width: 3rem;
  height: 3rem;
}


/*====================================

SINGLE

====================================*/

/* PAGENATION */

.single-pagenation {
  border-top: 0.1rem solid #cdd0d7;
}

.single-pagenation a {
  color: #caa14f;
}


/*====================================

CONTACT

====================================*/

.wpcf7-response-output {
  display: none;
}

.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
  font-size: 1.6rem;
  padding: 0.8rem;
  box-sizing: border-box;
  width: 100%;
  border: 0.1rem solid #ddd;
  border-radius: 0.4rem;
  font-weight: 400;
  font-family: 'Noto Sans JP', 'Roboto', sans-serif;
  color: #333;
}

.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required {
  font-size: 1.6rem;
  padding: 0.8rem;
  box-sizing: border-box;
  width: 100%;
  border: 0.1rem solid #ddd;
  border-radius: 0.4rem;
  font-weight: 400;
  font-family: 'Noto Sans JP', 'Roboto', sans-serif;
  color: #333;
}

.wpcf7-not-valid-tip {
  font-size: 1.4rem !important;
  color: #e9321a !important;
}

.wpcf7-form-control.wpcf7-submit.has-spinner {
  font-size: 1.6rem;
  padding: 0.8rem 3.2rem;
  border-radius: 0.8rem;
  border: none;
  background-color: #caa14f;
  color: #fff;
}

/* THANKS */

.size--100 {
  width: 10rem;
  height: auto;
}



/*====================================

E-LEARNING__FAQ

====================================*/

.faq__menu-child {
  display: none;
}

.faq__unit--q,
.faq__unit--a {
  border-radius: 1.6rem;
}

.faq__menu-parent--inner:hover {
  cursor: pointer;
}

.faq__menu-parent .faq__menu-parent--inner::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  position: absolute;
  top: 50%;
  right: 1.2rem;
  transform: translate(-50%,-50%);
  border-right: 0.1rem solid #fff;
  opacity: 1;
  transition: .3s;
}

.faq__menu-parent.active .faq__menu-parent--inner::before {
  opacity: 0;
  transition: .3s;
}

.faq__menu-parent .faq__menu-parent--inner::after {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  position: absolute;
  top: calc(50% - 1.2rem);
  right: 0;
  transform: translate(-50%,-50%);
  border-bottom: 0.1rem solid #fff;
  opacity: 1;
  transition: .3s;
}



