/*** ----------------------------------------------------------------------------- 

reset

-----------------------------------------------------------------------------  ***/
.clearfix:after {
	content:".";
	display:block;
	visibility:hidden;
	clear:both;
	height:0.1px;
	font-size:0.1em;
	line-height:0;
}
.clearfix {
	display:inline-table;
	zoom:1;
}
/*Hides from IE-mac \*/
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}


/* End hide from IE-mac */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin:0px;
	padding:0px;
}　
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, th, var {
	font-style:normal;
	font-weight:normal;
}
ul {
	list-style:none;
}
ol li{
	list-style:none;
}
caption, th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
sup {
	vertical-align:top;
}
sub {
	vertical-align:text-bottom;
}
input, textarea, select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
input, textarea, select {
 *font-size:100%;
}
legend {
	color:#000000;
}
img {
	vertical-align:bottom;
  height: auto;
}
table caption {
	font-weight: bold;
	margin:0 0 5px;
}
/* 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;
}


/*** ------------------------------------------------------------------------------ 

HTML5

-----------------------------------------------------------------------------  ***/
#header, footer, nav, section, article, figure, aside {
	display:block;
}
* {
	box-sizing:border-box;
}
i{
	margin: 0 5px 0 0;
}
img{
	max-width: 100%;
	image-rendering: -webkit-optimize-contrast;
}

/*** ------------------------------------------------------------------------------ 

common

-----------------------------------------------------------------------------  ***/
html {
	font-size: 62.5%;
	overflow-x: hidden;
  overflow-x: clip;
	height: 100%;
}
body {
	color: var(--color_black);
	line-height: 2.0;
	font-size: 1.6rem;
	font-family: "Noto Sans JP", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", MS PGothic, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
  overflow-x: clip;
}
@media (max-width:768px){
	body {
		font-size: 1.6rem;
		font-family: "Noto Sans JP", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", MS PGothic, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	}
}


.inner01{
	max-width: 1360px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner02{
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner03{
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner04{
	max-width: 1130px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner05{
	max-width: 1230px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
@media (max-width:768px){
	.inner01{
		padding: 0 20px;
	}
	.inner02{
		padding: 0 20px;
	}
  .inner03{
		padding: 0 20px;
	}
}

.pc{ display: block;}
.sp{ display: none;}
@media (max-width:768px){
	.pc{ display: none;}
	.sp{ display: block;}
}


/*** ----------------------------------------------------------------------------- 

変数定義

-----------------------------------------------------------------------------  ***/
:root{
    /* カラー　*/
    --color_red: #E60012;
    --color_beige: #FAF7F1;
    --color_brown: #590000;
    --color_yellow: #FFE300;
    --color_black: #000000;

    /* フォント */
    --font_ja: "Noto Sans JP", sans-serif;
    --font_ja-min: "Noto Serif JP", serif;
    --font_ja-m-plus: "M PLUS 1p", sans-serif;
    --font_ja-maru: "Zen Maru Gothic", sans-serif;
    --font_ja--dela: "Dela Gothic One", sans-serif;
    --font_en: "Roboto", sans-serif;
}


/*** ------------------------------------------------------------------------------ 

リンク

-----------------------------------------------------------------------------  ***/
/* 基本 */
a{
	color: var(--color_base);
	outline:none;
	-webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
a img {
	transition: 0.3s;
}

input[type=text],
textarea {
  -webkit-appearance: none;
}



/*** ------------------------------------------------------------------------------ 

header

-----------------------------------------------------------------------------  ***/
.header{
/*  position: fixed;
  left: 0;
  top: 15px;
  z-index: 200;
  */
  width: 100%;
}
/*
.header--style01{
  top: 15px; 
}
*/
.header-cont{
  position: fixed;
  left: 50%;
  top: 15px;
  z-index: 200;
  transform: translateX(-50%);
  /*max-width: 1360px;*/
  max-width: 1172px;
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  margin: 0 0 0 -95px;
}
.header--style01 .header-cont{
  top: 15px; 
}
@media (max-width:1295px){
  .header-cont{
    left: 0;
    transform: translateX(0%);
    margin: 0;
  } 
}
.header-cont-in{
  max-width: 1130px;
  padding: 0 10px;
  box-sizing: border-box;
  background: #fff;
  display: flex;
  align-items: center;
  border-radius: 40px;
  position: relative;
}
.header-cont__logo{
  width: 160px;
  text-align: center;
}
.header-cont-in nav{
  width: calc(100% - 160px);
  display: flex;
}
.header-cont-in nav .header-list{
  width: 67%; /* 多言語表示の場合 */
  width: 75%;/* 多言語非表示の場合 */
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px 0 0;
  box-sizing: border-box;
}

.header-cont-in nav .header-list__item--customer{
  position: relative;
}
.header-cont-in nav .header-list__item--customer::after{
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  content: '';
  width: 1px;
  height: 24px;
  background: rgba(0,0,0,0.32);
}

.header-cont-in nav .header-list__item > a{
  font-size: 1.5rem;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  display: block;
  padding: 20px 0;
}
.header-cont-in nav .header-list__item.has-child > a{
  padding: 20px 20px 20px 0;
  background: url("../img/icon-arrow-under.svg") no-repeat right center;
}
.header-cont-in nav .header-list__item.blank > a{
  padding: 20px 20px 20px 0;
  background: url("../img/icon-blank-black.svg") no-repeat right center;
}
.header-cont-in nav .header-list__item > a::after{
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 100%;
  height: 3px;
  background: var(--color_red);
  transform: scale(0);
  transition: 0.3s;
}
.header-cont-in nav .header-list__item:hover > a::after{
  background: var(--color_red);
  transform: scale(1);
}

.header-cont-in nav .child-box{
  position: absolute;
  left: 50%;
  top: 70px;
  z-index: -1;
  max-width: 950px;
  width: 100%;
  padding: 10px 0 0;
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  transition: 0.1s;
}
.header-cont-in nav .header-list__item.has-child:hover .child-box,
.header-cont-in nav .header-sublist__item.has-child:hover .child-box{
  opacity: 1;
  visibility: visible;
}
.header-cont-in nav .child-box-in{
  width: 100%;
  padding: 25px 30px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 8px;
}
.header-cont-in nav .child-box .child-box-flex{
  display: flex;
  align-items: center;
  margin: 0 0 10px;
  padding: 0 0 15px;
  border-bottom: 2px solid #5A5A5A;
}
.header-cont-in nav .child-box .child-box-flex .child-box-flex__img{
  width: 125px;
  padding: 0 25px 0 0;
  box-sizing: border-box;
}
.header-cont-in nav .child-box .child-box-flex .child-box-flex__text{
  width: calc(100% - 125px);
  box-sizing: border-box;
  font-size: 1.5rem;
  font-weight: bold;
}
.header-cont-in nav .child-box .child-box-flex .child-box-flex__text a{
  text-decoration: none;
  display: block;
  background: url("../img/icon-circleArrow.svg") no-repeat right 20px center;
  transition: 0.3s;
  padding: 5px 0;
}
.header-cont-in nav .header-sublist__item--lang  .child-box{
  top: 65px;
}
.header-cont-in nav .header-sublist__item--lang  .child-box ul{
  background: #fff;
  padding: 10px 20px 11px;
  border-radius: 10px;
}
.header-cont-in nav .header-sublist__item--lang  .child-box ul li{
  text-align: center;
}
.header-cont-in nav .header-sublist__item--lang  .child-box ul li a{
  text-decoration: none;
  font-size: 1.2rem;
  font-weight: 500;
  transition: 0.3s;
}
.header-cont-in nav .header-sublist__item--lang  .child-box ul li.is_active a{
  color: #aaa;
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-flex .child-box-flex__text{
  text-align: left;
}
@media (min-width: 769px){
  .header-cont-in nav .header-sublist__item--lang  .child-box ul li a:hover{
    color: #aaa;
  }
  .header-cont-in nav .child-box .child-box-flex .child-box-flex__text a:hover{
    background: url("../img/icon-circleArrow.svg") no-repeat right 15px center;
    color: var(--color_red);
  }
}
.header-cont-in nav .child-box .child-box-flex .child-box-flex__text span{
  font-size: 3.5rem;
  font-weight: 900;
  margin: 0 20px 0 0;
}

.header-cont-in nav .child-box .child-box-sub-list{
  display: flex;
  flex-wrap: wrap;
  gap: 0 4%;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item{
  width: calc(100% / 3 - 2.7%);
  margin: 5px 0 0;
  border-bottom: 1px solid #C1C1C1;
  box-sizing: border-box;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item a{
  display: block;
  padding: 30px 40px 30px 70px;
  font-size: 1.5rem;
  font-weight: 500;
  box-sizing: border-box;
  position: relative;
  text-decoration: none;
  transition: 0.3s;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item a::after{
  position: absolute;
  right: 20px;
  top: 50%;
  content: '';
  transform: translateY(-50%);
  width: 15px;
  height: 10px;
  background: url("../img/icon-arrow-red.svg") no-repeat center center;
  transition: 0.3s;
}




@media (min-width: 769px){
  .header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item a:hover::after{
    right: 15px;
  }
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--company a{
  padding: 30px 40px 30px 0;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product01 a{
  background: url("../img/nav-product-01.svg") no-repeat left 10px center;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product02 a{
  background: url("../img/nav-product-02.svg") no-repeat left 10px center;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product03 a{
  background: url("../img/nav-product-03.svg") no-repeat left 10px center;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product04 a{
  background: url("../img/nav-product-04.svg") no-repeat left 10px center;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product05 a{
  background: url("../img/nav-product-05.svg") no-repeat left 10px center;
}
.header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item--product06 a{
  background: url("../img/nav-product-06.svg") no-repeat left 10px center;
}
@media (min-width: 769px){
  .header-cont-in nav .child-box .child-box-sub-list .child-box-sub-list__item a:hover{
    color: var(--color_red);
  }
}
.header-cont-in nav .header-sublist{
  width: 33%; /* 多言語表示の場合 */
  width: 25%; /* 多言語非表示の場合 */
  display: flex;
  align-items: center;
  padding: 0 0 0 20px;
  box-sizing: border-box;
}
.header-cont-in nav .header-sublist .header-sublist__item{
  line-height: 1.5;
}
.header-cont-in nav .header-sublist .header-sublist__item--lang{
  padding: 17px 20px 17px 0;
  transform: translateY(-2px);
  position: relative;
  
  display: none; /* 多言語は公開後移行の対応のため、一時的に非表示 */
}
/*
.header-cont-in nav .header-sublist .header-sublist__item--lang::before{
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  content: '';
  width: 1px;
  height: 24px;
  background: rgba(0,0,0,0.32);
}
*/
.header-cont-in nav .header-sublist .header-sublist__item--lang > a{
  font-size: 1.2rem;
  font-weight: 500;
  background: url("../img/icon-lang.svg") no-repeat left center;
  padding: 3px 0 3px 20px;
  text-decoration: none;
  display: inline-block;
  line-height: 1.0;
}
.header-cont-in nav .header-sublist .header-sublist__item--online{
  text-align: center;
  padding: 9px 0;
}
.header-cont-in nav .header-sublist .header-sublist__item--online > a{
  display: block;
  text-align: center;
  padding: 15px 40px 15px 42px;
  border: 1px solid var(--color_red);
  box-sizing: border-box;
  font-size: 1.4rem;
  font-weight: bold;
  color: #fff;
  border-radius: 35px;
  text-decoration: none;
  background: url("../img/icon-cart-white.svg") no-repeat left 15px center, url("../img/icon-arrow-under-white.svg") no-repeat right 20px center, var(--color_red);
  position: relative;
}
@media (min-width:769px){
  .header-cont-in nav .header-sublist .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a:hover{
    color: #000;
  }
  .header-cont-in nav .header-sublist .header-sublist__item--online > a::after{
    position: absolute;
    left: 50%;
    bottom: -10px;
    content: '';
    transform: translateX(-50%) scale(0);
    width: 84%;
    height: 3px;
    background: var(--color_red);
    transition: 0.3s;
  }
  .header-cont-in nav .header-sublist .header-sublist__item--online:hover > a::after{
    background: var(--color_red);
    transform:  translateX(-50%) scale(1);
  }
}
.header-cont-in nav .header-sublist .header-sublist__item--online br{
  display: none;
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list{
  padding: 0 20px;
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item{
  border-bottom: none;
  width: calc(100% / 4 - 3%);
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a{
  padding: 0;
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a::after{
  content: none;
}

.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a .img img{
  border: 1px solid #C1C1C1;
  border-radius: 8px;
  box-sizing: border-box;
  transition: 0.3s;
}


.header-cont-in .sp-btn-list{
  display: none;
}
@media (min-width:769px){
  .header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a:hover .img img{
    border: 1px solid var(--color_red);
  }
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a .title{
  font-weight: bold;
  text-align: left;
  margin: 10px 0 0;
  padding: 0 20px 0 0;
  background: url("../img/icon-blank-red.svg") no-repeat right bottom 5px;
}
.header-cont-in nav .header-sublist__item--online .child-box .child-box-sub-list .child-box-sub-list__item a .title br{
  display: block;
}
@media (max-width:1170px){
  .header-cont-in nav .header-list{
    width: 70%;
  }
  .header-cont-in nav .header-sublist{
    width: 30%;
  }
  
  
  .header-cont-in nav .header-list__item--recruit{
    position: relative;
  }
  .header-cont-in nav .header-list__item--recruit::after{
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    content: '';
    width: 1px;
    height: 24px;
    background: rgba(0,0,0,0.32);
  }
  .header-cont-in nav .header-list__item--customer{
    display: none;
  }
  .header-cont-in nav .header-sublist .header-sublist__item--lang{
    display: none;
  }
  .header-cont-in nav .header-sublist{
    justify-content: flex-end;
  }
}
@media (max-width:1000px){
  .header-cont-in nav .header-list{
    width: calc(100% - 155px);
  }
  .header-cont-in nav .header-sublist{
    width: 155px;
  }
  .header-cont-in nav .header-sublist .header-sublist__item--online > a{
    padding: 5px 27px 5px 35px;
    background: url("../img/icon-cart-white.svg") no-repeat left 10px center, url("../img/icon-arrow-under-white.svg") no-repeat right 10px center, var(--color_red);
  }
  .header-cont-in nav .header-sublist .header-sublist__item--online br{
    display: block;
  }
}
@media (max-width:850px){
  .header{
    top: 0;
  }
  .header-cont{
    top: 0;
    padding: 0;
  }
  .header-cont-in{
    border-radius: 0 0 8px 8px;
    height: 70px;
    padding: 0;
  }
  .header-cont-in.is_active{
    border-radius: 0 0 0 8px;
  }
  .header-cont__logo{
    width: 86px;
    margin: 0 0 0 10px;
  }
  .header-cont-in nav{
    display: none;
  }
  .header-cont-in .sp-btn-list{
    display: flex;
    align-items: center;
    margin: 0 0 0 auto;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item:nth-child(1){
    width: 76px;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item:nth-child(2){
    width: 50px;
    text-align: center;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang{
    position: relative;
    display: none;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang > a{
    display: block;
    font-size: 1.0rem;
    padding: 35px 0 12px;
    text-align: center;
    background: url("../img/sp-header-btn-02.svg") no-repeat center top 18px;
    text-decoration: none;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang .child-box{
    position: absolute;
    left: -20px;
    top: 80px;
    opacity: 0;
    visibility: hidden;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang.is_active .child-box{
    opacity: 1;
    visibility: visible;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang .child-box ul{
    background: #fff;
    width: 90px;
    padding: 10px 5px;
    box-sizing: border-box;
    border-radius: 10px;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang .child-box ul li{
    background: #fff;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang .child-box ul li a{
    font-size: 1.2rem;
    text-decoration: none;
  }
  .header-cont-in .sp-btn-list .sp-btn-list__item--lang .child-box ul li.is_active a{
    color: #aaa;
  }
  
  .header-cont-in .sp-btn-list #menu{
		color:#000;
		font-size:0.76em;
		height:70px;
		overflow:hidden;
    position: relative;
	}
	.header-cont-in .sp-btn-list #menu:before{
		content:"menu";
		display:block;
		position:absolute;
		left:0;
		top:35px;
		width:60px;
		text-align: center;
		font-size:1.1rem;
		z-index:999;
	}
	.header-cont-in .sp-btn-list #menu.close{
		background: url(../img/#header_menu_bg02.png) center 40px no-repeat;
		background-size: auto 7px ;
	}
	.header-cont-in .sp-btn-list #menu a{
	  display: inline-block;
	  position: relative;
	  width: 60px;
	  height:70px;
	  overflow:hidden;
    transition: 0.3s;
	}
  .header-cont-in .sp-btn-list #menu.close a{
    background: var(--color_beige);
	}
	.header-cont-in .sp-btn-list #menu a span{
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  width: 24px;
	  height: 2px;
	  margin: -6px 0 0 -12px;
	  background: var(--color_red);
	  transition: .2s;
	  text-indent:-9999px;
	}
	.header-cont-in .sp-btn-list #menu a span:before,
  .header-cont-in .sp-btn-list #menu a span:after{
	  display: block;
	  content: "";
	  position: absolute;
	  top: 50%;
	  left: 0;
	  width: 24px;
	  height: 2px;
	  background: var(--color_red);
	  transition: .3s;
	}
	.header-cont-in .sp-btn-list #menu a span:before{
	  margin-top: -6px;
	}
	.header-cont-in .sp-btn-list #menu a span:after{
	  margin-top: 4px;
	}
	.header-cont-in .sp-btn-list #menu a .close{
	  background: transparent;
	}
	.header-cont-in .sp-btn-list #menu a .close:before,
  .header-cont-in .sp-btn-list #menu a .close:after{
	  margin-top: 0;
	}
	.header-cont-in .sp-btn-list #menu a .close:before{
	  transform: rotate(-45deg);
	  -webkit-transform: rotate(-45deg);
	}
	.header-cont-in .sp-btn-list #menu a .close:after{
	  transform: rotate(-135deg);
	  -webkit-transform: rotate(-135deg);
	}

}

/*** ------------------------------------------------------------------------------ 

.sp-menu-cont

-----------------------------------------------------------------------------  ***/
.sp-menu-cont{
  display: none;
}
@media (max-width:850px){
  .sp-menu-cont{
    display: block;
    position: fixed;
    top: 70px;
    right: -100%;
    z-index: 190;
    width: 95%;
    background: #fff;
    border-radius: 0 0 8px 8px;
    transition: 0.3s;
  }
  .sp-menu-cont.is_active{
    right: 0;
  }
  .sp-menu-cont nav{
    padding: 0 0 30px;
    overflow-y: scroll;
    height: calc(100vh - 70px - 40px);
  }
  .sp-menu-cont nav .sp-menu-cont-bland-list{
    display: flex;
    justify-content: space-between;
    padding: 25px 30px;
    background: var(--color_beige);
  }
  .sp-menu-cont nav .sp-menu-cont-bland-list__item{
    width: calc(100% / 3 - 10px);
    text-align: center;
  }
  .sp-menu-cont nav .sp-menu-cont-list{
    padding: 20px 35px 35px;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item{
    position: relative;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > a{
    display: block;
    font-size: 1.5rem;
    font-weight: bold;
    padding: 15px 30px 15px 0;
    text-decoration: none;
    position: relative;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item.blank a::after{
    position: absolute;
    right: -25px;
    top: 0;
    content: '';
    width: 60px;
    height: 100%;
    background: url("../img/icon-blank-black.svg") no-repeat center center;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > span{
    position: absolute;
    right: -35px;
    top: 0;
    width: 75px;
    height: 60px;
    display: block;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > span:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 50%;
    /*margin: -1px 0 0 0;*/
    width: 10px;
    height: 2px;
    background-color: #000;
    transition: .2s;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    border-right: none;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > span:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 50%;
    /*margin: -1px 0 0 0;*/
    width: 10px;
    height: 2px;
    background-color: #000;
    transition: .3s;
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > span.on:before{
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
  }
  .sp-menu-cont nav .sp-menu-cont-list__item > span.on:after{
    background-color: transparent;
  }
  
  
  .sp-menu-cont nav .sp-menu-cont-childList{
    border-top: 1px solid #000;
    display: none;
  }
  .sp-menu-cont nav .sp-menu-cont-childList .sp-menu-cont-childList__item{
    border-bottom: 1px solid #aaa;
  }
  
  .sp-menu-cont nav .sp-menu-cont-childList .sp-menu-cont-childList__item a{
    display: block;
    font-size: 1.2rem;
    font-weight: 500;
    padding: 15px 30px 15px 0;
    text-decoration: none;
    background: url("../img/icon-arrow-red.svg") no-repeat right center;
  }
  .sp-menu-cont nav .menu-online-btn{
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0 25px;
    position: relative;
    z-index: 2;
  }
  .sp-menu-cont nav .menu-online-btn a{
    display: block;
    padding: 17px 40px 17px 50px;
    font-size: 1.4rem;
    max-width: 270px;
    width: 100%;
    margin: 0 auto;
    background: url("../img/icon-cart-white.svg") no-repeat left 35px center, var(--color_red);
    text-decoration: none;
    color: #fff;
    border-radius: 35px;
    box-sizing: border-box;
    position: relative;
  }
  .sp-menu-cont nav .menu-online-btn a::after{
    position: absolute;
    right: 20px;
    top: 50%;
    content: '';
    transform: translateY(-50%);
    width: 21px;
    height: 21px;
    background: url("../img/icon-menu-online-btn-close.svg") no-repeat center center;
  }
  .sp-menu-cont nav .menu-online-btn.on a::after{
    background: url("../img/icon-menu-online-btn-open.svg") no-repeat center center;
  }
  .sp-menu-cont nav .sp-menu-cont-online-list{
    max-width: 250px;
    width: 100%;
    margin: -25px auto 0;
    padding: 40px 20px 20px 20px;
    background: #F4F4F4;
    box-sizing: border-box;
    border-radius: 0 0 10px 10px;
    display: none;
  }
  .sp-menu-cont nav .sp-menu-cont-online-list .sp-menu-cont-online-list__item{
    border-bottom: 1px solid #aaa;
  }
  .sp-menu-cont nav .sp-menu-cont-online-list .sp-menu-cont-online-list__item a{
    display: block;
    font-size: 1.2rem;
    font-weight: 500;
    padding: 10px 20px 10px 0;
    background: url("../img/icon-blank-red.svg") no-repeat right center;
  }
  
}


/*** ------------------------------------------------------------------------------ 

fix-nav-bg

-----------------------------------------------------------------------------  ***/
.fix-nav-bg{
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.4);
  opacity: 0;
  visibility: hidden;
  transition: 0.2s;
}
.fix-nav-bg.is_active{
  opacity: 1;
  visibility: visible;
}


/*** ------------------------------------------------------------------------------ 

side-fix-list

-----------------------------------------------------------------------------  ***/
.side-fix-list{
  position: fixed;
  right: 0;
  top: 130px;
  z-index: 20;
  background: #fff;
  padding: 15px;
  border-radius: 8px 0 0 8px;
  transition: 0.3s;
}
.side-fix-list__item{
  margin: 0 0 10px;
}
.side-fix-list__item:last-child{
  margin: 0;
}
.side-fix-list__item a{
  transition: 0.3s;
}
@media (min-width:769px){
  .side-fix-list__item a:hover{
    opacity: 0.6;
  } 
}
@media (max-width:768px){
  .side-fix-list{
    display: none;
  }
}

/*** ------------------------------------------------------------------------------ 

footer

-----------------------------------------------------------------------------  ***/
.footer{
  padding: 60px 0 70px;
  background: #fff;
}
.footer-cont01-fix{
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
  display: flex;
}
.footer-cont01-info{
  width: 556px;
  padding: 0 56px 0 0;
}
.footer-cont01-info-fl{
  display: flex;
  align-items: center;
  margin: 0 auto 55px;
}
.footer-cont01-info-fl-logo{
  width: 200px;
}
.footer-cont01-info-fl-text{
  width: calc(100% - 200px);
}
.footer-cont01-info-list{
  display: flex;
  flex-wrap: wrap;
  gap: 0 4%;
}
.footer-cont01-info-list--sp{
  display: none;
}
.footer-cont01-info-list__item{
  width: calc(100% / 2 - 2.1%);
  margin: 0 0 20px;
}
.footer-cont01-info-list__item a{
  display: block;
  text-decoration: none;
}
.footer-cont01-info-list__item a .footer-cont01-info-list__item-img{
  display: block;
  position: relative;
  width: 100%;
  padding: 1px;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 4px;
}
.footer-cont01-info-list__item a .footer-cont01-info-list__item-img::after{
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  content: '';
  width: 100%;
  height: 100%;
  /*border: 1px solid #C1C1C1;*/
  box-shadow: 0px 0px 0px 1px #b2b2b2 inset;
  box-sizing: border-box;
  border-radius: 4px;
}
.footer-cont01-info-list__item a .footer-cont01-info-list__item-img img{
  transition: 0.3s;
}
.footer-cont01-info-list__item a .footer-cont01-info-list__item-title{
  margin: 0.5em 0 0;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.4;
  transition: 0.3s;
}
.footer-cont01-info-list__item a.blank .footer-cont01-info-list__item-title span{
  padding: 0 20px 0 0;
  background: url("../img/icon-blank-black03.svg") no-repeat right center;
}
@media (min-width:769px){
  .footer-cont01-info-list__item a:hover .footer-cont01-info-list__item-img img{
    transform: scale(1.04);
  }
  .footer-cont01-info-list__item a:hover .footer-cont01-info-list__item-title{
    color: var(--color_red);
  }
  .footer-cont01-info-list__item a.blank:hover .footer-cont01-info-list__item-title span{
    background: url("../img/icon-blank-red03.svg") no-repeat right center;
  }
}
.footer-cont01-nav{
  width: calc(100% - 556px);
  display: flex;
  gap: 0 5%;
}
.footer-cont01-list{
  max-width: 300px;
  width: 100%;
}
.footer-cont01-list__item{
  border-bottom: 1px solid #C1C1C1;
  position: relative;
}
.footer-cont01-list__item:first-child{
  border-top: 1px solid #C1C1C1;
}
.footer-cont01-list__item > a{
  display: block;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 17px 30px 17px 15px;
  text-decoration: none;
  position: relative;
}
.footer-cont01-list__item > a::after{
  position: absolute;
  right: 10px;
  top: 50%;
  content: '';
  transform: translateY(-50%);
  width: 10px;
  height: 8px;
  background: url("../img/ft-icon-arrow.svg") no-repeat center center;
}
.footer-cont01-list__item--blank > a::after{
  position: absolute;
  right: 10px;
  top: 50%;
  content: '';
  transform: translateY(-50%);
  width: 13px;
  height: 13px;
  background: url("../img/ft-icon-blank.svg") no-repeat center center;
}
.footer-cont01-list__item.has-child > a{}
.footer-cont01-list__item.has-child > a::after{
  content: none;
}
.footer-cont01-list__item.has-child > span{
  position: absolute;
  right: 0;
  top: 0;
  width: 60px;
  height: 64px;
  display: block;
  cursor: pointer;
}
.footer-cont01-list__item.has-child > span:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	margin: -1px 0 0 -4px;
	width: 8px;
	height: 2px;
	background-color: #000;
	transition: .2s;
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	border-right: none;
}
.footer-cont01-list__item.has-child > span:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	margin: -1px 0 0 -4px;
	width: 8px;
	height: 2px;
	background-color: #000;
	transition: .3s;
}
.footer-cont01-list__item.has-child > span.on:before{
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
}
.footer-cont01-list__item.has-child > span.on:after{
	background-color: transparent;
}
.footer-cont01-child-list{
  display: none;
}
.footer-cont01-child-list__item{
  margin: 0 0 15px;
  padding: 0 30px;
}
.footer-cont01-child-list__item a{
  font-size: 1.4rem;
  font-weight: 500;
  text-decoration: none;
}
.footer-cont01-child-list__item--blank a{
  display: block;
  padding: 0 20px 0 0;
  background: url("../img/icon-blank-red.svg") no-repeat right center;
}
.footer-cont02{
  margin: 45px auto 0;
}
.footer-cont02-fix{
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-end;
}
.footer-cont02-fix-box{
  width: 556px;
  display: flex;
  align-items: flex-end;
}
.footer-cont02-sns-list{
  display: flex;
  align-items: center;
  gap: 0 20px;
  margin: 0 35px 0 0;
}
.footer-cont02-sns-list__item{
  max-width: 33px;
}
.footer-cont02-sns-list__item a{
  transition: 0.3s;
}
.footer-cont02-sub-list{
  display: flex;
  gap: 0 30px;
}
.footer-cont02-sub-list__item{
  line-height: 1.4;
}
.footer-cont02-sub-list__item a{
  font-size: 1.3rem;
  font-weight: bold;
  transition: 0.3s;
  text-decoration: none;
}
.footer-cont02__copyright{
  width: calc(100% - 556px);
  text-align: right;
  font-size: 1.4rem;
  font-weight: 500;
  color: #727272;
  line-height: 1.4;
  padding: 0 60px 0 0;
}
@media (min-width:769px){
  .footer-cont02-sns-list__item a:hover{
    opacity: 0.8;
  }
  .footer-cont02-sub-list__item a:hover{
    color: var(--color_red);
  }
  .footer-cont01-list__item > a:hover{
    color: var(--color_red); 
  }
  .footer-cont02-sub-list__item a.no-link:hover,
  .footer-cont01-list__item > a.no-link:hover{
    color: #000;
  }
  .footer-cont01-child-list__item a:hover{
    color: var(--color_red);
    text-decoration: none;
  }
}
@media (max-width:1180px){
  .footer-cont01-nav{
    display: block;
  }
  .footer-cont01-list:first-of-type .footer-cont01-list__item:last-child{
    border-bottom: none;
  }
}
@media (max-width:1000px){
  .footer-cont02-fix{
    flex-wrap: wrap;
  }
  .footer-cont02__copyright{
    width: 100%;
    text-align: left;
    margin: 20px 0 0;
  }
}
@media (max-width:880px){
  .footer-cont01-fix{
    display: block;
  }
  .footer-cont01-info{
    width: 100%;
    padding: 0;
  }
  .footer-cont01-info-fl{
    justify-content: center;
  }
  .footer-cont01-info-fl-text{
    width: auto;
  }
  .footer-cont01-info-list--pc{
    display: none;
  }
  .footer-cont01-info-list--sp{
    display: flex;
    margin: 30px 0 0;
    padding: 0 10px;
  }
  .footer-cont01-info-list__item a .footer-cont01-info-list__item-title{
    text-align: left;
  }
  .footer-cont01-nav{
    width: 100%;
  }
  .footer-cont01-list{
    max-width: 100%;
  }
}
@media (max-width:768px){
  .footer{
    padding: 35px 0 60px;
  }
  .footer-cont01-info-fl{
    flex-wrap: wrap;
    margin: 0 auto 40px;
  }
  .footer-cont01-info-fl-text{
    order: 2;
    width: 100%;
    text-align: center;
  }
  .footer-cont01-info-fl-logo{
    order: 1;
    width: 100%;
    text-align: center;
    margin: 0 0 25px;
  }
  .footer-cont01-info-list__item a .footer-cont01-info-list__item-title{
    font-size: 1.3rem;
  }
  .footer-cont02{
    margin: 25px auto 0;
  }
  .footer-cont02-fix-box{
    display: block;
    width: 100%;
  }
  .footer-cont02-sub-list{
    margin: 20px auto 0;
    gap: 0 20px;
  }
  .footer-cont02-sub-list__item a{
    font-size: 1.2rem;
  }
  .footer-cont02__copyright{
    padding: 0;
    font-size: 1.2rem;
  }
}

/*** ------------------------------------------------------------------------------ 

main

-----------------------------------------------------------------------------  ***/
main{
  margin: 100px auto 0;
}
#home main{
  margin: 0 auto;
}
/*@media (max-width:768px){*/
@media (max-width:850px){
  main{
    margin: 70px auto 0;
  } 
}



/*** ------------------------------------------------------------------------------ 

headline01

-----------------------------------------------------------------------------  ***/
.headline01{}
.headline01 .headline01__en{
  font-size: 6.0rem;
  font-weight: 900;
  line-height: 1.0;
  text-align: center;
}
.headline01 .headline01__ja{
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  margin: 0.5em 0 0;
}




/*** ------------------------------------------------------------------------------ 

headline02

-----------------------------------------------------------------------------  ***/
.headline02{
  position: relative;
  display: flex;
  align-items: flex-end;
}
.headline02::before{
  position: absolute;
  left: -25px;
  top: 50%;
  margin: -6px 0 0;
  content: '';
  width: 12px;
  height: 12px;
  background: var(--color_red);
  border-radius: 50%;
}
.headline02::after{
  position: absolute;
  left: -1040px;
  top: 50%;
  margin: -1px 0 0;
  content: '';
  width: 95px;
  width: 1000px;
  height: 2px;
  background: var(--color_red);
}
.headline02__en{
  font-size: 6.0rem;
  font-weight: 900;
  line-height: 1.0;
}
.headline02__en--small{
  font-size: 4.0rem;
  font-weight: 900;
  line-height: 1.0;
}
.headline02__ja{
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.0;
  margin: 0 0 0 20px;
  transform: translateY(-4px);
}
@media (max-width:1140px){
  .headline02{
    padding: 0 0 0 20px;
  }
  .headline02::before{
    position: absolute;
    left: -5px;
    top: 50%;
    margin: -4px 0 0;
    content: '';
    width: 12px;
    height: 12px;
    background: var(--color_red);
    border-radius: 50%;
  }
  .headline02::after{
    position: absolute;
    left: -105px;
    top: 50%;
    margin: 0px 0 0;
    content: '';
    width: 95px;
    height: 2px;
    background: var(--color_red);    
  }
}
@media (max-width:768px){
  .headline02{
    padding: 0 0 0 20px;
    display: block;
  }
  .headline02::before{
    content: none;
  }
  .headline02::after{
    content: none;
  }
  /*
  .headline02::before{
    position: absolute;
    left: -5px;
    top: 50%;
    margin: -12px 0 0;
    content: '';
    width: 12px;
    height: 12px;
    background: var(--color_red);
    border-radius: 50%;
  }
  .headline02::after{
    position: absolute;
    left: -105px;
    top: 50%;
    margin: -7px 0 0;
    content: '';
    width: 95px;
    height: 2px;
    background: var(--color_red);
    border-radius: 50%;
  }
  */
  .headline02__ja{
    font-size: 1.6rem;
    margin: 10px 0 0;
  }
  .headline02__en{
    font-size: min(4.2rem, 10.0vw);
    position: relative;
  }
  .headline02__en::before{
    position: absolute;
    left: -22px;
    top: 50%;
    content: '';
    width: 12px;
    height: 12px;
    transform: translateY(-50%);
    background: var(--color_red);
    border-radius: 50%;
  }
  .headline02__en::after{
    position: absolute;
    left: -122px;
    top: 50%;
    content: '';
    width: 95px;
    height: 2px;
    transform: translateY(-50%);
    background: var(--color_red);
  }
  
  
  .headline02__en--small{
    font-size: 3.0rem;
  }
}




/*** ------------------------------------------------------------------------------ 

headline03

-----------------------------------------------------------------------------  ***/
.headline03{
  margin: 0 auto 25px;
}
.headline03 .headline03__ja{
  text-align: center;
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1.5;
  margin: 0 0 5px;
}
.headline03 .headline03__en{
  text-align: center;
  font-family: var(--font_en);
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.5;
  color: var(--color_red);
}
@media (max-width:768px){
  .headline03 .headline03__ja{
    font-size: 1.8rem;
  }
  .headline03 .headline03__en{
    font-size: 1.4rem;
  }
}



/*** ------------------------------------------------------------------------------ 

headline04

-----------------------------------------------------------------------------  ***/
.headline04{
  margin: 0 auto 50px;
  display: flex;
  align-items: flex-end;
}
.headline04 .headline04__en{
  font-family: var(--font_en);
  font-size: 6.0rem;
  font-weight: 900;
  line-height: 1.0;
  margin: 0 10px 0 0;
}
.headline04 .headline04__en .span01{
  display: inline-block;
}
.headline04 .headline04__ja{
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.0;
  transform: translateY(-8px);
}
@media (max-width:768px){
  .headline04{
    margin: 0 auto 35px;
    flex-wrap: wrap;
  }
  .headline04 .headline04__en{
    font-size: 3.6rem;
    margin: 10px 0 0;
    width: 100%;
    order: 2;
  }
  .headline04 .headline04__ja{
    transform: translateY(0);
    width: 100%;
    order: 1;
  }
}





/*** ------------------------------------------------------------------------------ 

visual-page

-----------------------------------------------------------------------------  ***/
.visual-page{
  padding: 28px 20px 32px;
  padding: 42px 20px 53px;
  border-bottom: 1px solid rgba(0,0,0,0.1);
}
.visual-page .visual-page__ja{
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
  position: relative;
}
.visual-page .visual-page__ja span{
  position: relative;
  padding: 0 0 0 20px;
}
.visual-page .visual-page__ja span::before{
  position: absolute;
  left: 0;
  top: 50%;
  content: '';
  width: 12px;
  height: 12px;
  background: var(--color_red);
  border-radius: 50%;
  transform: translateY(-50%);
}
.visual-page .visual-page__en{
  text-align: center;
  font-size: 4.0rem;
  font-weight: 900;
  line-height: 1.0;
}
@media (max-width:768px){
  .visual-page{
    padding: 50px 20px 58px;
    padding: 48px 20px 55px;
  }
  .visual-page .visual-page__ja{
    font-size: 1.4rem;
  }
  .visual-page .visual-page__en{
    font-size: 2.8rem;
    margin: 3px 0 0;
    line-height: 1.2;
  }
}


/*** ------------------------------------------------------------------------------ 

topic-pass

-----------------------------------------------------------------------------  ***/
.topic-pass{
  background: #F6F6F6;
}
.topic-pass ul{
  display: flex;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.topic-pass ul li{
    margin: 10px 0;
    font-size: 1.2rem;
}
.topic-pass ul li:nth-child(3){
    max-width: 675px;
    white-space: nowrap; /* 折り返し無しにする */
    overflow: hidden; /* はみ出た部分を非表示 */
    text-overflow: ellipsis; /* 語尾を3点リーダーに */
}
.topic-pass ul li{
  line-height: 1.0;
  font-size: 1.4rem;
}
.topic-pass ul li a{
  line-height: 1.0;
  font-size: 1.4rem;
  color: #666;
}
.topic-pass ul li::after{
  display: inline-block;
  content: '';
  margin: 0 7px;
  width: 7px;
  height: 11px;
  background: url("../img/pankuzu-arrow.svg") no-repeat center center;
}
.topic-pass ul li:last-child::after{
    content: none;
}
.parent-pageid-165 .topic-pass ul li:nth-child(2) a{
  pointer-events: none;
}

@media (max-width: 1240px){
    .topic-pass ul li:nth-child(3){
        max-width: 300px;
    }
}
@media (max-width: 1100px){
    .topic-pass ul li:nth-child(3){
        max-width: 200px;
    }
}
@media (max-width: 1000px){
    .topic-pass ul li:nth-child(3){
        max-width: 100px;
    }
}
@media (max-width: 768px){
    .topic-pass{
      padding: 2px 0 6px;
    }
    .topic-pass ul{
        justify-content: flex-start;
        flex-wrap: wrap;
        margin: 5px auto 0;
    }
    .topic-pass ul li{
        margin: 5px 0;
    }
    .topic-pass ul li:nth-child(3){
        max-width: 300px;
    }
}




/*** ------------------------------------------------------------------------------ 

btn

-----------------------------------------------------------------------------  ***/
.btn{}
.btn a{
  display: inline-block;
  text-decoration: none;
  min-width: 300px;
  height: 64px;
  background: #fff;
  text-align: left;
  font-size: 1.5rem;
  font-weight: bold;
  box-sizing: border-box;
  border-radius: 40px;
  position: relative;
  transition: 0.3s;
}

/* ここから下がボタンアニメーションのCSS　*/
.btn a{
  position: relative;
  opacity: 1 !important;
  transition: all 0.3s;
  background-color: #1D1D1D;
  border-radius: 40px;
  overflow: hidden;
}
.btn a:before,
.btn a:after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 0;
  background-color: var(--color_red);
  pointer-events: none;
}
.btn a:before {
  bottom: 0;
  left: 0;
}
.btn a:after {
  top: 0;
  right: 0;
}

.btn a .lottie{
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1.0;
}

@media (min-width:769px){
  .btn a:hover:before,
  .btn a:hover:after {
    height: 100%;
  }
  .btn a:hover{
    color: var(--color_red);
  }
  .btn a:hover:before {
    transition: height 0.2s 0.2s linear;
  }
  .btn a:hover:after {
    transition: height 0.2s linear;
  }
  .btn a span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    background-color: #FFF;
    border-radius: 38px;
    display: flex;
    align-items: center;
    z-index: 99;
    padding: 0 60px 0 30px;
  }
  .btn a span::after{
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 38px;
  }
}
@media (max-width:768px){
  .btn a{
    min-width: inherit;
    max-width: 300px;
    width: 100%;
    height: auto;
    background: #fff;
    border: 1px solid #1D1D1D;
    padding: 16px 60px 16px 30px;
  }
}



/* btn--red
------------------------------- */
.btn--red{}
.btn--red a{
/*  border: 1px solid var(--color_red);*/
  background: var(--color_red);
  color: #fff;
}

/* ここから下がボタンアニメーションのCSS　*/
.btn--red a{
  position: relative;
  opacity: 1 !important;
  transition: all 0.3s;
  background-color: var(--color_red);
  border-radius: 40px;
  overflow: hidden;
}
.btn--red a:before,
.btn--red a:after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 0;
  background-color: var(--color_red);
  pointer-events: none;
}
.btn--red a:before {
  bottom: 0;
  left: 0;
}
.btn--red a:after {
  top: 0;
  right: 0;
}
@media (min-width:769px){
  .btn--red a:hover:before,
  .btn--red a:hover:after {
    height: 100%;
  }
  .btn--red a:hover{
    color: var(--color_red);
  }
  .btn--red a:hover:before {
    transition: height 0.2s 0.2s linear;
  }
  .btn--red a:hover:after {
    transition: height 0.2s linear;
  }
  .btn--red a:hover span {
    background-color: #fff;
  }
}
.btn--red a span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  background-color: var(--color_red);
  border-radius: 38px;
  display: flex;
  align-items: center;
  z-index: 99;
  padding: 0 60px 0 30px;
}
.btn--red a span::after{
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 38px;
}
@media (max-width:768px){
  .btn--red a{
    height: 64px;
    padding: 0 60px 0 30px;
    border: none;
  }
}


/*** ------------------------------------------------------------------------------ 

btn-pagelink

-----------------------------------------------------------------------------  ***/
.btn-pagelink{}
.btn-pagelink a{
  display: inline-block;
  text-decoration: none;
  max-width: 300px;
  width: 100%;
  height: 64px;
  background: #fff;
  text-align: left;
  font-size: 1.5rem;
  font-weight: bold;
  box-sizing: border-box;
  border-radius: 40px;
  position: relative;
  transition: 0.3s;
}

/* ここから下がボタンアニメーションのCSS　*/
.btn-pagelink a{
  position: relative;
  opacity: 1 !important;
  transition: all 0.3s;
  background-color: #1D1D1D;
  border-radius: 40px;
  overflow: hidden;
}
.btn-pagelink a:before,
.btn-pagelink a:after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 0;
  background-color: var(--color_red);
  pointer-events: none;
}
.btn-pagelink a:before {
  bottom: 0;
  left: 0;
}
.btn-pagelink a:after {
  top: 0;
  right: 0;
}

.btn-pagelink a .lottie{
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1.25;
}

@media (min-width:769px){
  .btn-pagelink a:hover:before,
  .btn-pagelink a:hover:after {
    height: 100%;
  }
  .btn-pagelink a:hover{
    color: var(--color_red);
  }
  .btn-pagelink a:hover:before {
    transition: height 0.2s 0.2s linear;
  }
  .btn-pagelink a:hover:after {
    transition: height 0.2s linear;
  }
  .btn-pagelink a span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    background-color: #FFF;
    border-radius: 38px;
    display: flex;
    align-items: center;
    z-index: 99;
    padding: 0 60px 0 30px;
  }
  .btn-pagelink a span::after{
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 38px;
  }
}
@media (max-width:768px){
  .btn-pagelink a{
    min-width: inherit;
    max-width: 300px;
    width: 100%;
    height: auto;
    background: #fff;
    border: 1px solid #1D1D1D;
    padding: 16px 60px 16px 30px;
  }
}






/*** ------------------------------------------------------------------------------ 

btn-black

-----------------------------------------------------------------------------  ***/
.btn-black{}
.btn-black a{
  display: inline-block;
  text-decoration: none;
  max-width: 300px;
  width: 100%;
  background: #fff;
  text-align: left;
  font-size: 1.5rem;
  font-weight: bold;
  box-sizing: border-box;
  border-radius: 40px;
  position: relative;
  transition: 0.3s;
}
.btn-black a::before{
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 38px;
}

/* ここから下がボタンアニメーションのCSS　*/
.btn-black a{
  position: relative;
  opacity: 1 !important;
  transition: all 0.3s;
  border: 4px solid var(--color_yellow);
  padding: 25px 50px 25px 25px;
  background-color: #000;
  border-radius: 40px;
  overflow: hidden;
  color: var(--color_yellow);
}
.btn-black a svg{
  width: 40px !important;
  height: 40px !important;
}
.btn-black.blank a::after{
  position: absolute;
  right: 20px;
  top: 50%;
  content: '';
  width: 13px;
  height: 14px;
  background: url("../img/icon-blank-yellow.svg") no-repeat center center;
  transform: translateY(-50%);
  transition: 0.3s;
}
/*
.btn-black a:before,
.btn-black a:after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 0;
  background-color: #000;
  pointer-events: none;
}
.btn-black a:before {
  bottom: 0;
  left: 0;
}
.btn-black a:after {
  top: 0;
  right: 0;
}
*/
.btn-black a .lottie{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1.0;
}
@media (min-width:769px){
  .btn-black a:hover{
    background: var(--color_yellow);
    padding: 25px 50px 25px 25px;
    color: #000;
  }
  .btn-black a:hover::after{
    background: url("../img/icon-arrow-black01.svg") no-repeat center center;
  }
  .btn-black.blank a:hover::after{
    background: url("../img/icon-blank-black.svg") no-repeat center center;
  }
  /*
  .btn-black a:hover:before,
  .btn-black a:hover:after {
    height: 100%;
  }
  .btn-black a:hover:before {
    transition: height 0.2s 0.2s linear;
  }
  .btn-black a:hover:after {
    transition: height 0.2s linear;
  }
  */
}
@media (max-width:768px){
  .btn-black a{
    min-width: inherit;
    max-width: 300px;
    width: 100%;
  }
}
/*
.btn-black a span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 6px);
  height: calc(100% - 6px);
  background-color: #000;
  border-radius: 38px;
  display: flex;
  align-items: center;
  z-index: 99;
  padding: 0 60px 0 30px;
}
.btn-black a span::before{
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  content: '';
  width: 19px;
  height: 9px;
  background: url("../img/icon-arrow-yellow01.svg") no-repeat center center;
}
.btn-black a span::after{
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 38px;
}
*/



/*** ------------------------------------------------------------------------------ 

icon-thunder

-----------------------------------------------------------------------------  ***/
.icon-thunder{
  display: inline-block;
  width: 16px;
  height: 18px;
  background: url("../img/icon-thunder.svg") no-repeat center center;
  margin: 0 2px;
  transform: translateY(2px);
}



/*** ------------------------------------------------------------------------------ 

ページ内リンクズレ対策
ページ内リンクズレ対策

-----------------------------------------------------------------------------  ***/
.anchor{
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}
.anchor01{
    display: block;
    padding-top: 167px;
    margin-top: -167px;
}
@media(max-width:768px){
	.anchor01{
		display: block;
		padding-top: 100px;
		margin-top: -100px;
	}
}


/*** ------------------------------------------------------------------------------ 

スクロールアニメーション

-----------------------------------------------------------------------------  ***/
/*----------------------------
scroll_fade ｜フェード出現
----------------------------*/
.scroll_fade {
    transition: 0.8s ease-in-out;
    opacity: 0;
}
.scroll_fade.on {
    opacity: 1.0;
}

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
    transition: 0.8s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
}
.scroll_up.on {
	transform: translateY(0);
	opacity: 1.0;
	/*overflow: hidden;*/
}

.timing02 {transition-delay: .2s;}
.timing03 {transition-delay: .4s;}
.timing04 {transition-delay: .6s;}
.timing05 {transition-delay: .8s;}
.timing06 {transition-delay: 1.0s;}
.timing07 {transition-delay: 1.2s;}
.timing08 {transition-delay: 1.4s;}



/*** ------------------------------------------------------------------------------ 

    タブ切り替え

-----------------------------------------------------------------------------  ***/
.tab-target{}
.tab-target.hide{ display: none;}



/*** ------------------------------------------------------------------------------ 

paginations

-----------------------------------------------------------------------------  ***/
.paginations{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
}
.navigation.first .paginations{
    padding-top: 0;
    padding-bottom: 0;
}
.paginations li{
  margin: 0 5px 10px;
}
.paginations li a{
    border: solid 1px #7E7E7E;
    background-color: #fff;
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    border-radius: 50%;
    font-size: clamp(1.2rem,1.3vw,1.4rem);
    font-weight: 500;
    line-height: 1;
    text-align: center;
    display: block;
    position: relative;
    color: var(--color_black);
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
}
.paginations li:first-child a{
    width: 36px;
    border-radius: 50%;
}
.paginations li:last-child a{
    width: 36px;
    border-radius: 50%;
}
.paginations li.current a,
.paginations li a:hover{
    opacity: 1;
    background-color: var(--color_red);
    color: #fff;
    border: solid 1px  var(--color_red);
}
.paginations li.previous a{
  padding-left: 30px;
}
.paginations li.next a{
  padding-right: 30px;
}
.paginations li.previous a:before,
.paginations li.next a:after{
  content: '';
  display: inline-block;
  font-family: 'Material Icons';
  font-size: 2rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.paginations li.previous a:before{
  content: '\e5cb';
  left: 5px;
}
.paginations li.next a:after{
  content: '\e5cc';
  right: 5px;
}

