b@charset "UTF-8";
/*
 * AKテンプレート ver1.5
 *
 * 著作権なども特にありませんのでオープンソースとしてお使い下さい。
 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,
legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}

html {
  overflow: auto;
}
body {
  overflow:hidden;
  font-size:1em;
  font-size: 16px;
  line-height:1.5;
  font-family: メイリオ, Meiryo, 'Hiragino Kaku Gothic Pro',
    'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Arial, Verdana, sans-serif;
	background:#d1d8e0;
}

input,select,textarea{
  font-family: メイリオ, Meiryo, 'Hiragino Kaku Gothic Pro',
 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Arial, Verdana, sans-serif;
}

body,h1,h2,h3,h4,h5,p,ul,ol,li,dl,dd,dt{margin:0;padding:0px;}

li {
  list-style: none;
  margin: 0;
  padding: 0;
}


a {text-decoration: none; color:#7D7D7D;}
a:hover {text-decoration: none;}
/*a img:hover { opacity: 0.9; -moz-opacity: 0.9;}*/
a img {
  border-style:none;
}

img {
  vertical-align: bottom;
  line-height:0!important;
  display:block;
	width: 100%;
}

button{
  background-color: transparent;
  border: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
button:focus,
input:focus,
select:focus{
  outline: none;
}
button:hover{
  cursor:pointer
}

table{
  border-collapse: collapse;
}

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


/*--------------------------------------------------------
サイト毎に変化のある定数
--------------------------------------------------------*/

.fullscreen {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.contents {
  width: 768px;
  max-width: 768px;
  margin-right: auto;
  margin-left: auto;
}
.contents1800 {
  width: 100%;
  max-width: 1800px;
  margin-right: auto;
  margin-left: auto;
}
.contents900 {
  width: 100%;
  max-width: 768px;
  margin-right: auto;
  margin-left: auto;
}
.img_center {
  margin-left:-450px;
}
.img_left0{
  margin-left:0;
}

.text {
  font-size: 1rem;
  line-height:1.6;
}

.text p {
  padding-bottom: 1em;
  line-height: 1.8;
}

.back_white {background-color:#fff;}
.back_black {background-color:#000;}
.back_green1 {background-color:#1a9b0b;}
.back_green2 {background-color:#00b900;}
.back_green3 {background-color:#bff92c;}
.back_green4 {background-color:#eeffe7;}
.back_white {background-color:#fff;}
.back_clear {background-color: transparent;}
.back_yellow {background-color:#ffff00;}
.back_blue {background-color:#4abebf;}
.back_usu_blue {background-color:#ebf3f3;}

.white {color:#FFF;}
.black {color:#000;}
.green1 {background-color:#1a9b0b;}
.green2 {background-color:#00b900;}
.green3 {background-color:#bff92c;}
.green4 {background-color:#eeffe7;}
/*.red {color:#FF0000;}*/



/*--------------------------------------------------------
定数
--------------------------------------------------------*/
.c {text-align:center!important;}
.cm {
  margin-left: auto;
  margin-right: auto;
}
.r {text-align:right!important;}
.l {text-align:left!important;}

.b{font-weight: bold;}

.font80 {font-size:80px; font-size:5em;}
.font79 {font-size:79px; font-size:4.9375em;}
.font78 {font-size:78px; font-size:4.875em;}
.font77 {font-size:77px; font-size:4.8125em;}
.font76 {font-size:76px; font-size:4.75em;}
.font75 {font-size:75px; font-size:4.6875em;}
.font74 {font-size:74px; font-size:4.625em;}
.font73 {font-size:73px; font-size:4.5625em;}
.font72 {font-size:72px; font-size:4.5em;}
.font71 {font-size:71px; font-size:4.4375em;}
.font70 {font-size:70px; font-size:4.375em;}
.font69 {font-size:69px; font-size:4.3125em;}
.font68 {font-size:68px; font-size:4.25em;}
.font67 {font-size:67px; font-size:4.1875em;}
.font66 {font-size:66px; font-size:4.125em;}
.font65 {font-size:65px; font-size:4.0625em;}
.font64 {font-size:64px; font-size:4em;}
.font63 {font-size:63px; font-size:3.9375em;}
.font62 {font-size:62px; font-size:3.875em;}
.font61 {font-size:61px; font-size:3.8125em;}
.font60 {font-size:60px; font-size:3.75em;}
.font59 {font-size:59px; font-size:3.6875em;}
.font58 {font-size:58px; font-size:3.625em;}
.font57 {font-size:57px; font-size:3.5625em;}
.font56 {font-size:56px; font-size:3.5em;}
.font55 {font-size:55px; font-size:3.4375em;}
.font54 {font-size:54px; font-size:3.375em;}
.font53 {font-size:53px; font-size:3.3125em;}
.font52 {font-size:52px; font-size:3.25em;}
.font51 {font-size:51px; font-size:3.1875em;}
.font50 {font-size:50px; font-size:3.125em;}
.font49 {font-size:49px; font-size:3.0625em;}
.font48 {font-size:48px; font-size:3em;}
.font47 {font-size:47px; font-size:2.9375em;}
.font46 {font-size:46px; font-size:2.875em;}
.font45 {font-size:45px; font-size:2.8125em;}
.font44 {font-size:44px; font-size:2.75em;}
.font43 {font-size:43px; font-size:2.6875em;}
.font42 {font-size:42px; font-size:2.625em;}
.font41 {font-size:41px; font-size:2.5625em;}
.font40 {font-size:40px; font-size:2.5em;}
.font39 {font-size:39px; font-size:2.4375em;}
.font38 {font-size:38px; font-size:2.375em;}
.font37 {font-size:37px; font-size:2.3125em;}
.font36 {font-size:36px; font-size:2.25em;}
.font35 {font-size:35px; font-size:2.188em;}
.font34 {font-size:34px; font-size:2.125em;}
.font33 {font-size:33px; font-size:2.0625em;}
.font32 {font-size:32px; font-size:2em;}
.font31 {font-size:31px; font-size:1.938em;}
.font30 {font-size:30px; font-size:1.875em;}
.font29 {font-size:29px; font-size:1.8125em;}
.font28 {font-size:28px; font-size:1.75em;}
.font27 {font-size:27px; font-size:1.6875em;}
.font26 {font-size:26px; font-size:1.625em;}
.font25 {font-size:25px; font-size:1.563em;}
.font24 {font-size:24px; font-size:1.5em;}
.font23 {font-size:23px; font-size:1.4375em;}
.font22 {font-size:22px; font-size:1.375em;}
.font21 {font-size:21px; font-size:1.313em;}
.font20 {font-size:20px; font-size:1.25em;}
.font19 {font-size:19px; font-size:1.1875em;}
.font18 {font-size:18px; font-size:1.125em;}
.font17 {font-size:17px; font-size:1.063em;}
.font16 {font-size:16px; font-size:1em;}
.font15 {font-size:15px; font-size:0.9375em;}
.font14 {font-size:14px; font-size:0.875em;}
.font13 {font-size:13px; font-size:0.8125em;}
.font12 {font-size:12px; font-size:0.75em;}
.font11 {font-size:11px; font-size:0.6875em;}
.font10 {font-size:10px; font-size:0.625em;}

.margin800 {margin-top:80%;}
.margin700 {margin-top:70%;}
.margin600 {margin-top:60%;}
.margin500 {margin-top:50%;}
.margin400 {margin-top:40%;}
.margin350 {margin-top:30.5%;}
.margin300 {margin-top:30%;}
.margin200 {margin-top:20%;}
.margin150 {margin-top:15%;}
.margin100 {margin-top:10%;}
.margin90 {margin-top:9%;}
.margin80 {margin-top:8%;}
.margin75 {margin-top:7.5%;}
.margin70 {margin-top:7%;}
.margin60 {margin-top:6%;}
.margin50 {margin-top:5%;}
.margin40 {margin-top:4%;}
.margin35 {margin-top:3.5%;}
.margin30 {margin-top:3%;}
.margin25 {margin-top:2.5%;}
.margin20 {margin-top:2%;}
.margin10 {margin-top:1%;}
.padding300 {padding-top:30%;}
.padding250 {padding-top:25%;}
.padding200 {padding-top:20%;}
.padding150 {padding-top:15%;}
.padding100 {padding-top:10%;}
.padding90 {padding-top:9%;}
.padding80 {padding-top:8%;}
.padding70 {padding-top:7%;}
.padding60 {padding-top:6%;}
.padding50 {padding-top:5%;}
.padding40 {padding-top:4%;}
.padding30 {padding-top:3%;}
.padding25 {padding-top:2.5%;}
.padding20 {padding-top:2%;}
.padding10 {padding-top:1%;}

.visible1800{display: none;}
.visible900{display: none;}
.visible750{display: none;}
.visible600{display: none;}
.visible500{display: none;}
.visible400{display: none;}
.visible320{display: none;}



/* clearfix */
.clearfix:after{
  content: "";
  clear: both;
  display: block;
}


/*重なりの優先度*/
.relative {position:relative;}
.absolute {
    position: absolute;
}

.z_1{ z-index: -1; }
.z_2{ z-index: -2; }
.z_3{ z-index: -3; }
.z0{ z-index: 0; }
.z1{ z-index: +1; }
.z2{ z-index: +2; }
.z3{ z-index: +3; }
.z4{ z-index: +4; }
.z5{ z-index: +5; }
.z6{ z-index: +6; }
.z7{ z-index: +7; }
.z8{ z-index: +8; }
.z9{ z-index: +9; }
.z10{ z-index: +10; }
.z20{ z-index: +20; }
.z30{ z-index: +30; }
.z40{ z-index: +40; }
.z50{ z-index: +50; }
.z99{ z-index: +9999; }



/*横幅*/
.w100 {width:100%;}
.w90 {width:90%;}
.w80 {width:80%;}
.w70 {width:70%;}
.w60 {width:60%;}
.w50 {width:50%;}
.w40 {width:40%;}
.w30 {width:30%;}
.w20 {width:20%;}
.w10 {width:10%;}


.img_w90 {width: auto;max-width: 90%;}
.img_w80 {width: auto;max-width: 80%;}




/*--------------------------------------------------------
定数 ※個別設定
--------------------------------------------------------*/




/*--------------------------------------------------------
アニメーション
--------------------------------------------------------*/
@-webkit-keyframes pickup {
  0% {
    left: 15%;
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
  50% {
    left: 15%;
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    left: 15%;
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes pickup {
  0% {
    left: 15%;
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
  50% {
    left: 15%;
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    left: 15%;
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes pickup2 {
  0% {
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
       -moz-transform: scale(1.05);
        -ms-transform: scale(1.05);
         -o-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes pickup2 {
  0% {
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
       -moz-transform: scale(1.05);
        -ms-transform: scale(1.05);
         -o-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
       -moz-transform: scale(1);
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);
  }
}


.pickup{
  display: block;
   -webkit-animation-name: pickup;
  animation-name: pickup;
   -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
   -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
   -webkit-animation-delay: 0s;
  animation-delay: 0s;
   -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
	/*margin: 1.2em 0;*/
}
.pickup2{
  display: block;
   -webkit-animation-name: pickup2;
  animation-name: pickup2;
   -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
   -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
   -webkit-animation-delay: 0s;
  animation-delay: 0s;
   -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}


/*spin*/
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
       -o-transform: rotate(0deg);
          transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
       -o-transform: rotate(360deg);
          transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
       -o-transform: rotate(0deg);
          transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
       -o-transform: rotate(360deg);
          transform: rotate(360deg);
  }
}

.spin {
  -webkit-animation: spin 30s linear 0s infinite;
  -moz-animation: spin 30s linear 0s infinite;
  -ms-animation: spin 30s linear 0s infinite;
  -o-animation: spin 30s linear 0s infinite;
  animation: spin 30s linear 0s infinite;
}



/*********
* wobble2 *
**********/

@-webkit-keyframes wobble2 {
  0% { -webkit-transform: translateX(0%); }
  7.5% { -webkit-transform: translateX(-3.125%) rotate(-2.5deg); }
  15% { -webkit-transform: translateX(2.5%) rotate(1.5deg); }
  22.5% { -webkit-transform: translateX(-1.125%) rotate(-1.5deg); }
  30% { -webkit-transform: translateX(1.25%) rotate(1deg); }
  37.5% { -webkit-transform: translateX(-0.625%) rotate(-1deg); }
  50% { -webkit-transform: translateX(0%); }
}
@keyframes wobble2 {
  0% { transform: translateX(0%); }
  7.5% { transform: translateX(-3.125%) rotate(-2.5deg); }
  15% { transform: translateX(2.5%) rotate(1.5deg); }
  22.5% { transform: translateX(-1.125%) rotate(-1.5deg); }
  30% { transform: translateX(1.25%) rotate(1deg); }
  37.5% { transform: translateX(-0.625%) rotate(-1deg); }
  50% { transform: translateX(0%); }
}
.wobble2.go {
    -webkit-animation-name: wobble2;
    animation-name: wobble2;
    -webkit-animation-duration: 3s;
   animation-duration: 3s;
}



@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand.go {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
	-webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

/********
* Shake *
********/
@-webkit-keyframes shake2 {
    0%, 50% {-webkit-transform: translateX(0);}
    5%, 15%, 25%, 35%, 45% {-webkit-transform: translateX(-3px);}
    10%, 20%, 30%, 40% {-webkit-transform: translateX(3px);}
}
@keyframes shake2 {
    0%, 50% {transform: translateX(0);}
    5%, 15%, 25%, 35% ,45% {transform: translateX(-3px);}
    10%, 20%, 30%, 40% {transform: translateX(3px);}
}
.shake2.go {
    -webkit-animation-name: shake2;
    animation-name: shake2;
    -webkit-animation-duration: 3s;
   animation-duration: 3s;
}
/*--------------------------------------------------------
//アニメーション
--------------------------------------------------------*/






/*--------------------------------------------------------
ヘッダー
--------------------------------------------------------*/

header {
	background: #2d3436;
    padding: 2%;
    margin: 0 auto;
	color: #fff;
	text-align: center;
    font-weight: bold;
}

/*--------------------------------------------------------
フッター
--------------------------------------------------------*/
footer {
  position:relative;
  z-index:2;
  text-align:center;
  background-color: #2d3436;
  color: #fff;
  max-width: 768px;
  margin: 0 auto;	
}
.copyright{
  padding: 2.5% 0;
}
.copyright,
.copyright a{
  font-size: 12px;
}
.copyright a:hover{
  text-decoration: underline;
}

/*--------------------------------------------------------
各種レイアウト
--------------------------------------------------------*/
#wrapper {
  padding-top:0px !important;
	background-color: #f8a5c2;

}
#wrapper1 {
  padding-top:0px !important;
	background-image: linear-gradient( 45deg, rgba(255, 55, 216, 1) 10%, rgba(161, 15, 255, 1) 100%);


}
#wrapper2 {
  padding-top:0px !important;
	background-image: linear-gradient( 315deg, rgba(255, 55, 216, 1) 10%, rgba(161, 15, 255, 1) 100%);

}
.wrapper1 {
  padding-top:0px !important;
	background-image: linear-gradient( 45deg, rgba(255, 55, 216, 1) 10%, rgba(161, 15, 255, 1) 100%);


}
.wrapper2 {
  padding-top:0px !important;
	background-image: linear-gradient( 315deg, rgba(255, 55, 216, 1) 10%, rgba(161, 15, 255, 1) 100%);

}
.scrollbox h1 {
    margin-bottom: 5%;
    padding-top: 5%;
    font-size: 16px;
}
.bg01 {
	background: #fff !important;
	padding-top: 2.5%;
}
.bg02 {
}
.bg03 {
}
.bg04 {
}
.bg05 {
}
.bg06 {
}


#vcbiz_top{
	
}
.vcbiz_top_2{
    top: 45%;
}
.vcbiz_top_3{
    top: 25%;
}
.vcbiz_top_4{
    bottom: 5%;
}
#vcbiz_1{
	background: #2d3436;
	font-size: clamp(14px, 1.8vw, 16px);
	color: #fff;
	padding: 2.5% 2%;
}
#vcbiz_1 span{
	color: #fed330;
}
#vcbiz_1 section{
	font-weight: bold;
}
*, *:before, *:after {
    box-sizing: border-box;
}
.pr.absolute {
    top: 2.5%;
    right: 0;
    /*border: solid 1px #353b48;*/
    padding: 2.5px 10px;
    color: #353b48;
    border-radius: 6px;
    font-size: 0.7em;
}
#vcbiz_2{
	font-size: clamp(12px, 1.8vw, 16px);
    padding: 3% 2%;
    text-align: center;
}
.col_2{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
	font-weight: bold;
}
.col_2 > *{
    width: calc( 50% - 6px ) ;
    margin-right: 12px;
}
.col_2 > *:nth-child(2n){
    margin-right: auto;
}
.col_2 > * > *{
    background: #fff;
    position: relative;
    overflow: hidden;
	padding: 5% 2%;
}
.active, .active_cat2{
	color: #ee609c;
}
.active:before{
  content: "";
  position: absolute;
  right: calc(50% - 0px);
  bottom: 3%;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  border-width: 20px 20px 0 20px;
}
.active_cat2:before{
  content: "";
  position: absolute;
  right: calc(-50% - 0px);
  bottom: 3%;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  border-width: 20px 20px 0 20px;
}
.passive div{
	background: none;
	border: solid 2px #fff;
	box-sizing: content-box !important;
	padding: clamp(2%, 1.8vw, 16px);
	color: #fff;
}
.passive div a{
	color: #fff;
	display: block;
}
#vcbiz_3{
	font-size: clamp(14px, 1.8vw, 16px);
    padding: 3% 2%;
}
#box1,#box2,#box3,#box4,#box5,#box6{
	font-size: clamp(14px, 1.8vw, 16px);
}
.vcbiz_box{
	background: #fff;
	padding: 2% 2% 4%;
	border-radius: 6px;
	box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.35);
}
.vcbiz_box_top{
	font-weight: bold;
	font-size: clamp(14px, 1.8vw, 16px);
}
.vcbiz_box_title{
	padding: 0 0 1% 0;
	border-bottom: #596275 solid 2px;
	margin-bottom: 2.5%;
}
.vcbiz_box_number{
	background: #f5cd79;
	color: #303952;
	padding: 1.3vh 1vw;
}
.vcbiz_box_top{
	font-weight: bold;
	font-size: clamp(14px, 1.8vw, 16px);
	/*margin-bottom: 2%;*/
	padding: 0 0 0 1.5vw
}
@media screen and (min-width: 768px) {
  .vcbiz_box_top {
    padding: 1.2vh 0 0 1vw } }

.vcbiz_box_top_pc {
    font-weight: bold;
    font-size: clamp(14px, 1.8vw, 16px);
    margin-bottom: 2%;
}
.vcbiz_box_top_pc:after {
  content:"";
   display:block;
   width:100%;
   height:3px;
   background-color:#fed330;
	margin-top: 1%;
}
.vcbiz_box_thum{
	max-width:300px;
	width: 30%;
}
.vcbiz_box_thum img{
	border-radius: 10%;
}
.vcbiz_box_name{
	color: #546de5;
	margin-bottom: 1%;
}
.flex{
	display: flex
}
.vcbiz_box_right{
	padding-left: 2%;
	width: 100%;
}
/*評価*/
.rating_ios, .rating_android{
	    margin-bottom: 1%;
}
.rating_ios:before{
	content: '';
    background-image: url(../img/icon_ios.webp);
    vertical-align: middle;
    padding-right: 5px;
    display: inline-block;
    background-size: contain;
    width: clamp(1.8em, 1.8vw, 3em);
    height: clamp(1.8em, 1.8vw, 3em);
	position: relative;
    top: -0.6vh ;
	margin-right: 1%;
	background-repeat: no-repeat;
}
.rating_android:before{
	content: '';
	background-image:url(../img/icon_android.webp);
	vertical-align: middle;
    padding-right: 5px;
    display: inline-block;
    background-size: contain;
    width: clamp(1.8em, 1.8vw, 3em);
    height: clamp(1.8em, 1.8vw, 3em);
	position: relative;
    top: -0.6vh ;
	margin-right: 1%;
	background-repeat: no-repeat;
}
.rating_line:before{
	content: '';
    background-image: url(../img/icon_line_rating.webp);
    vertical-align: middle;
    padding-right: 5px;
    display: inline-block;
    background-size: contain;
    width: clamp(1.8em, 1.8vw, 3em);
    height: clamp(1.8em, 1.8vw, 3em);
	position: relative;
    top: -0.6vh ;
	margin-right: 1%;
	background-repeat: no-repeat;
}
.rating_livechat:before{
	content: '';
    background-image: url(../img/icon_livechat.webp);
    vertical-align: middle;
    padding-right: 5px;
    display: inline-block;
    background-size: contain;
    width: clamp(1.8em, 1.8vw, 3em);
    height: clamp(1.8em, 1.8vw, 3em);
	position: relative;
    top: -0.6vh ;
	margin-right: 1%;
	background-repeat: no-repeat;
}
.score{
	color: #424242;
    font-size: 10px;
    margin-left: 1%;
	position: relative;
    top: -0.3vh;
}
.star5_rating{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #d1d8e0; /* グレーカラー 自由に設定化 */
	font-size: clamp(16px, 1.8vw, 30px);
    /*font-size: 30px; フォントサイズ 自由に設定化 */
	top: -0.3vh;
}

.star5_rating:before, .star5_rating:after{
    content: '★★★★★';
}

.star5_rating:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #f5cd79; /* イエローカラー 自由に設定化 */
}

.star5_rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5_rating[data-rate="4.5"]:after{ width: 90%; } /* 星4.5 */
.star5_rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.5"]:after{ width: 70%; } /* 星3.5 */
.star5_rating[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5_rating[data-rate="2.5"]:after{ width: 50%; } /* 星2.5 */
.star5_rating[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5_rating[data-rate="1.5"]:after{ width: 30%; } /* 星1.5 */
.star5_rating[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5_rating[data-rate="0.5"]:after{ width: 10%; } /* 星0.5 */
.star5_rating[data-rate="0"]:after{ width: 0%; } /* 星0 */

/*評価ここまで*/

.vcbiz_box_bottom {
    margin-top: 4%;
	margin-bottom: 6%;
}
.vcbiz_box_pc {
    margin-top: 4%;
}
.vcbiz_pc p{
	margin-bottom: 1.2em;
	line-height: 1.8em;
}
.vcbiz_pc p:last-of-type{
	margin-bottom: 0px;
}
ol.vcbiz_pc_list{
  counter-reset:list;
  list-style-type:none;
  font: 14px/1.6 'arial narrow', sans-serif;
  padding:0;
}

ol.vcbiz_pc_list li{
  position:relative;
  padding: 0 0 0 40px;
  margin: 7px 0 7px 0px;
  font-weight: bold;
  /*font-size:14px;*/
  line-height: 29px;
  border: dashed 1px transparent;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
	border-bottom-color: #fd9644;
	text-align: left;
}
.p_15{
	margin-bottom: 1.5em;
}
ol.vcbiz_pc_list li:before{
  counter-increment: list;
  content: counter(list);
  position: absolute;
  left: 0px;
  width: 30px;
  height: 30px;
  text-align: center;
  color: #fff;
  line-height:30px;
  background: #fd9644;
  border-radius: 50%;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

span.marker {
    background: linear-gradient(transparent 50%, #fed330 50%);
	font-weight: bold;
}
span.marker_pink {
    background: linear-gradient(transparent 50%, #cf6a87 50%);
	font-weight: bold;
	color: #fff;
    text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, 0-1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
}
.red {
    color: #fc5c65 !important;
	font-weight: bold !important;
}
span.bold {
	font-weight: bold;
}
.vcbiz_box_card{
	margin-bottom: 6%;
}
/*ボタン*/
.vcbiz_box_button{
	text-align: center;
}
.button-simple {
	width: 90%;
    position: relative;
    font-weight: bold;
    padding: 0.8em 15px;
    margin: 0px 5px;
    border-radius: 12px;
    font-size: 18px;
    background-color: #778beb;
    color: #fff;
    display: inline-block;
    text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
    box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}
.button-simple:before {
    font-family: "Font Awesome 6 Free";
    content: '\f144';/*好きなアイコン*/
    color: #fff;/*アイコンの色*/
    margin-right: 3%;
}
a:hover .button-simple {
    background-color: #fc5c65;/*触れたときの背景色*/
    color: #fff;/*触れたときの文字色*/
    box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
    animation-play-state: paused;
    top: 5px;
}
.button-back {
	width: 90%;
    position: relative;
    font-weight: bold;
    padding: 0.8em 15px;
    margin: 0px 5px;
    border-radius: 12px;
    font-size: 18px;
    background-color: #2d3436;
    color: #fff;
    display: inline-block;
    text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
}

.pekopeko {
    animation: pekopeko 2s infinite;
    box-shadow: 0 5px 0 rgb(84, 109, 229, 1);
}
@keyframes pekopeko {
    0% {
        box-shadow: 0 5px 0 rgb(84, 109, 229, 1);
        top: 0px;
    }
    10% {
        box-shadow: 0 0 0 rgb(84, 109, 229, 1);
        top: 5px;
    }
    20% {
        box-shadow: 0 5px 0 rgb(84, 109, 229, 1);
        top: 0px;
    }
    30% {
        box-shadow: 0 0 0 rgb(84, 109, 229, 1);
        top: 5px;
    }
    40% {
        box-shadow: 0 5px 0 rgb(84, 109, 229, 1);
        top: 0px;
    }
}
/**list-styleを指定する**/
.vcbiz_box_tag{    
    list-style: none;
	width: 5vw;
	display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

/** 見た目を整える **/
.vcbiz_box_tag,li{
    margin:0px;
    padding:0px;
	
}

.tag_base{
	flex: 1 0 auto;
	padding: 10% 30%;
    margin-right: 0.4em;
	text-align: center;
    color:white;
	border-radius: 5px;
	font-size: 12px;
}

.tag1{
	background-color: #574b90;
}
.tag2{
	background-color: #c44569;
}
.tag3{    
    background-color: #3dc1d3;
}
.tag4{
	background-color: #f5cd79;
}
.tag5{
	background-color: #e66767;
}
/*スクロールUI
.horizontal_scroll {
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 0 8px;
  display: -ms-flexbox;
  display: flex; 
  margin-top: 3%;}*/
.horizontal_scroll {
  padding: 0 1.5%;
  display: -ms-flexbox;
  display: flex; 
  margin-top: 1.5%;}

/* 画面幅が768px以上の場合、横スクロールを解除 */
@media screen and (min-width: 768px) {
  .horizontal_scroll {
    overflow-x: inherit;
    padding: 0 1.5%; } }

.horizontal_scroll > li {
  width: 100%;
  /*min-width: 70%;*/ }

@media screen and (min-width: 768px) {
  .horizontal_scroll > li {
    min-width: inherit; } }

.horizontal_scroll > li:not(:last-child) {
  margin-right: 5px; }

.horizontal_scroll > li:last-child {
  /*padding-right: 5px;*/
/*margin-right:5px;*/}

@media screen and (min-width: 768px) {
  .horizontal_scroll > li:last-child {
    padding-right: 0; } }

.horizontal_scroll img {
  vertical-align: bottom; }

/*スクロール指
@keyframes return {
  50% {
    right: 60%;
  }
  100% {
    right: 60%;
	   opacity: 0;
  }
}
.return {
  width:  30px;
    position: absolute;
   top: 20%;
   right: 20%;
   transform: translateX(-50%);

  animation-name: return;
  animation-duration: 5s;
  animation-iteration-count: 1;
  animation-timing-function: ease;
	color: #fff;
	animation-fill-mode: forwards;
}
.return:before {
    font-family: "Font Awesome 6 Free";
    content: '\f0a6';/*好きなアイコン
    color: #fff;/*アイコンの色
    margin-right: 2%;
	font-size: 4vh;
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.fade-out {
  animation: fadeOut 3s;
}
*/
.horizontal_scroll li{
	border: solid 2.5px #fff;
	border-radius: 10px;
    /*padding: 2.5% 0;*/
}
.horizontal_scroll li a{
    color: #fff;
}
.horizontal_scroll img{
	border-radius: 10px;
}
/*.videoapp:before {
    content: '';
    background-image: url(../img/icon_video.webp);
    vertical-align: middle;
    display: inline-block;
    background-size: contain;
    width: 1.3em;
    height: 1.3em;
    position: relative;
    top: -0.1em;
    margin-right: 1vw;
}
.matchingapp:before {
    content: '';
    background-image: url(../img/icon_matching.webp);
    vertical-align: middle;
    display: inline-block;
    background-size: contain;
    width: 1.3em;
    height: 1.3em;
    position: relative;
    top: -0.1em;
    margin-right: 1vw;
}
.lineicon:before {
    content: '';
    background-image: url(../img/icon_line.webp);
    vertical-align: middle;
    display: inline-block;
    background-size: contain;
    width: 1.3em;
    height: 1.3em;
    position: relative;
    top: -0.1em;
    margin-right: 1vw;
}
.liveicon:before {
    content: '';
    background-image: url(../img/icon_live.webp);
    vertical-align: middle;
    display: inline-block;
    background-size: contain;
    width: 1.3em;
    height: 1.3em;
    position: relative;
    top: -0.1em;
    margin-right: 1vw;
}*/
.footermenu{
	margin-top: 5%;
    padding-bottom: 5%;
}
.triangle{
   clip-path: polygon(0 0,100% 0, 100% 95%, 50% 100%,0 95%);
}
.triangle_margin{
	padding-top: 17.8%;
}
.ql-video{
	width: 96%;
	height: auto;
	margin: 0 2% 6.25%;
}
.hr_wide{
	border: solid 1px #ecf0f1;
	width: 96%;
	margin: 6.25% auto;
}
.hr_wide_12{
	border: solid 1px #ecf0f1;
	width: 96%;
	margin: 12.5% auto;
}

.grid{
	/* 方眼紙模様に必須のスタイル */
	background-image: linear-gradient(0deg, transparent calc(100% - 1px), #edf1f8 calc(100% - 1px)),
		linear-gradient(90deg, transparent calc(100% - 1px), #edf1f8 calc(100% - 1px));
	background-size: 0.725em 0.725em;
	background-repeat: repeat;
	background-position: center center;
	/* 以下任意のスタイル */
	padding: 20px;
}


.random-element {
    display: none;
}
.random-element2 {
    display: none;
}
.head{
	text-align: center;
    padding: 1% 0;
    color: #fff;
}
.vcbiz_box_name a {
    color: #546de5;
}
.yellow{
			background: #f5cd79;
		}
		h2.vcbiz_box_name.center {
    text-align: center;
}
		.white_kadomaru_box{
			background: #fff;
			padding: 2%;
			border-radius: 6px;
			margin-bottom: 0%;
		}
		h2.vcbiz_box_name.muryo_subtitle {
			font-size: 1.3em;
			text-align: center;
			color: #242424;
		}
		.vcbiz_box_muryo{
			padding: 2%;
    border-radius: 6px;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.35);
		}
		.vcbiz_box_muryo img{
			margin-bottom: 3%;
		}

/* ポップアップ */
        .popup-area {
            display:none;
            width:80vw;
            background:#fff;
            padding:0px;
            position: fixed;
            z-index: 9999;   
            top: 50%;
            left: 50%;
            transform: translateY(-50%) translateX(-50%);
            text-align: center;
            border-radius:8px;
            box-shadow: 0 0 4px 4px rgba(0,0,0,0.4);
        }
        @media screen and (min-width: 980px) {
                .popup-area {
                width:auto;
                max-width: 460px;
            }
        }
        .popup-area button {
            margin:15px auto;
        }
        .popup-area .icon{
            font-size:3em;
            color:red;
        }
        /* 背景色 */
        .cover-eml {
            background:rgba(0,0,0,0.3);
            width: 100%;
            height: 100%;
            position: fixed;
            z-index: 999;   
            top:0;
            right:0;
            bottom:0;
            left:0;
        }
.tokuten {
    color: #e74c3c;
    font-weight: bold;
    text-align: center;
    margin-bottom: 1.5%;
}
/*モーダル*/
.popup{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
}
.popup .wrap{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.popup .wrap .bg{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    position: absolute;
    top: 0;
    left: 0;
}
.popup .wrap .set{
    width: calc(100% - 40px);
    max-width: 800px;
    height: 400px;
    z-index: 1;
    position: relative;
    background: #fff;
}
.popup .wrap .set .close{
    position: absolute;
    top: -40px;
    right: 0;
	background: #000;
    border-radius: 6px 6px 0 0;
    text-align: center;
}
.popup .wrap .set .close span{
    width: 40px;
    height: 40px;
    cursor: pointer;
	display: table-cell;
    vertical-align: middle;
}
.popup .wrap .set .inner{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  
  background: #f3a683;
	padding: 2.5% 2.5% 3%;
}
/*プライバシーポリシー*/
.privacy li {
	text-align: LEFT;
    list-style-type: disc;
    margin-left: 20px;
}
.privacy ul{
	margin-top: 5%;
}	

	.inner_box{
		background: #fff;
    border-radius: 6px;
    padding: 2.5%;
		font-weight: bold;
		display: block;
		margin-bottom: 2.5%;
		box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.35);
	}
	.inner_box:last-child{
		margin-bottom: 0%;
	}
.fa-solid, .fas {
    color: #fff;
}	
	.inner_title{
		font-size: 14px !important;
	}
	.tag6{
		background: #596275;
		color: #f5cd79;
		vertical-align: middle;
}
.tag7{
		background: #ecf0f1;
		color: #e74c3c;
		vertical-align: middle;
    margin: auto 0 auto 10px;
    font-weight: bold;
	}
	.inner_thum{
		width: 35%;
	}
	.modal_title{
		margin-bottom: 2.5%;
	}
.link_icon{
	border-radius: 10%;
	max-width: 120px;
	margin: 0 auto;
	border: solid 2px #dfe6e9;
}
.footer_menu{
	padding-bottom: 5%;
}
.fukidashi {
    position: relative;
    margin: 0 auto 1.5em;
    padding: 0.5em;
    text-align: center;
    min-width: 120px;
    max-width: 70%;
    color: #fc5c65;
    font-weight: bold;
    font-size: 12px;
    background: #e0edff;
}

.fukidashi:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #e0edff;
}

.fukidashi p {
  margin: 0;
  padding: 0;
}
/*--------------------------------------------------------
//各種レイアウト
--------------------------------------------------------*/
@font-face {
  font-family: "impact";
  src: url("../font/impact.woff")  format('woff');
}
@font-face {
  font-family: "din";
  src: url("../font/din.woff")  format('woff');
}

ul,li{ padding:0px; margin:0px; list-style:none;}


ul{width:100%;margin:0 auto;}
li{ text-align:center;}

.formtext {
    width: 90%;
    margin: 0 auto;
    padding: 3% 0;
}



.content{
    width: 100%;
    max-width: 75.5%;
    margin-right: auto;
    margin-left: auto;
    position:relative;
    overflow:hidden;
    }
.content2{
    width: 100%;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    position:relative;
    overflow:hidden;
    }

.main_animation {
    margin: 0 auto;
	width:100% !important;
	height:auto !important;
}
.main_animation canvas{
	width: 100% !important;
	height:auto !important;
}


.lightbox { display: none; }

	
.cl_box{
    margin: 0 auto 1% auto;}
	
.cl_box a{ color:#FFF;}

.sp{ display:none;}


.mfrom {
    width: 100%;
    /* text-align: center; */
    outline: 0;
    border: #231815 2px solid;
    color: #a6a8a8;
    font-size: 1.4vw;
    margin: 0 auto 5% auto;
    padding: 1.5% 3%;
}

.pc{ display:block;}
.sp{ display:none;}


.blue_line{
	background:#69049d;

	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.blue_line:before{
    content: "";
    display: block;
    padding-top: 1%; /* 1:1 */
    }

.blue_lineh{    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
	right:0;
    width: 100%;
    height: 100%;
	margin:0 auto;}

/* ====== フィルターエリア（カード風 + 2列均等配置） ====== */
.filter-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2列均等配置 */
    gap: 15px;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    display: none; /* 初期状態は非表示 */
    transition: all 0.3s ease-in-out;
}
.pc {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2列均等配置 */
    gap: 15px;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;
    margin: 3% 2%;
    transition: all 0.3s ease-in-out;
}

/* ====== 各フィルターグループ（等分幅） ====== */
.filter-group {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
}

/* フィルターのラベル */
.filter-group label {
    font-size: 14px;
    font-weight: bold;
    color: #555;
    margin-bottom: 5px;
}

/* スタイリッシュなプルダウンメニュー */
.filter-group select {
    width: 100%;
    padding: 10px;
    font-size: 14px;
    border-radius: 6px;
    border: 1px solid #ddd;
    background: #f9f9f9;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}

.filter-group select:hover,
.filter-group select:focus {
    border-color: #007bff;
    background: #fff;
    box-shadow: 0px 0px 5px rgba(0, 123, 255, 0.3);
    outline: none;
}

/* ====== 「全表示」ボタン（2列分の幅を取る） ====== */
.reset-filter {
    width: 100%;
    text-align: center;
    padding: 12px;
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(135deg, #28a745, #1e7e34);
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    grid-column: span 2; /* 2列分の幅を取る */
    margin-top: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.reset-filter:hover {
    background: linear-gradient(135deg, #1e7e34, #145d25);
}

/* ====== スマホ対応（レスポンシブデザイン） ====== */
@media (max-width: 768px) {
    .filter-container {
        width: 90%;
        grid-template-columns: repeat(1, 1fr); /* スマホでは1列 */
        padding: 15px;
    }

    .filter-group select {
        font-size: 16px;
        padding: 12px;
    }

    .accordion-toggle {
        font-size: 14px;
        padding: 10px;
    }

    .reset-filter {
        grid-column: span 1; /* スマホでは1列 */
    }
}

        .hidden { display: none; }

.p1{
	background: url(../img/001.jpg) no-repeat;
	background-position: center top;
	background-size: 100% 58%;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p1:before{
    content: "";
    display: block;
     /* 1:1 */
    padding-top: 86.75%;
    }

.p1h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	

.p2{
	background: #fef8d4;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p2:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p2h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	
	
.p3{
	background: #FFF;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p3:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p3h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p4{
	background: url(../img/001.jpg) no-repeat;
	background-position: center top;
	background-size: 100% 58%;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p4:before{
    content: "";
    display: block;
     /* 1:1 */
    padding-top: 80%;
    }

.p4h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p5{
	background: url(../img/005.jpg) no-repeat;
	background-position: center top;
	background-size: cover;
	background-attachment: fixed;
	position:relative;
	height: auto;
	margin: 0;
	z-index: 2;
	}
.p5:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p5h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	
.p6{
	background: #FFF;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p6:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p6h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	


.cl{background: #505050;color:#FFF;padding:1% 0;}


.p1 img,.p2 img,.p3 img,.p4 img,.p5 img,.p6 img,.p7 img,.p8 img,.p9 img,.p10 img,.p11 img,.p12 img,.p13 img,.p14 img,.p15 img,.p16 img,.p17 img,.p18 img,.p19 img,.p20 img,.p21 img,.p22 img,.p23 img,.t1 img,.w01 img,.t2 img,.t3 img,.t4 img,.t5 img,.t6 img,.t7 img,.t8 img,.p21 img,.p22 img,.p23 img,.p24 img,.p25 img,.p26 img{ width:100%;}
.addFriend input{ width:100%;}


.form_box1{position: absolute;top: 63%;width: 55.3%;left: 0%;right: 0%;margin: 0% auto 0% auto;z-index: 1;}
.form_box1 input{
    width: 100%;
    height: 0%;
    text-align: center;
    border-radius: 0;
    outline: 0;
    border: #aaa 2px solid;
    color: #666;
    font-size: 2.2vw;
    margin: 0 auto 3% auto;
    padding: 3% 5%;
}

.main_animation{ margin:0 auto;}

.e1{position: absolute;left: 0;right: 0;top: 4%;width: 32.4%;margin: 0 auto;z-index: 1;}
.e2{position: absolute;top: 14%;width: 34%;left: 30.8%;margin: 0 auto;z-index: 2;}
.e3{position: absolute;left: 0;right: 0;top: 29%;width: 38.3%;margin: 0 auto;z-index: 1;}
.e4{position: absolute;top: 8.5%;width: 17%;right: 27%;margin: 0 auto;z-index: 1;}
.e5{position: absolute;top: 10%;width: 46.0%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e6{position: absolute;top: 39%;width: 38.3%;left: 0;right: 0;margin: 0 auto;z-index: 0;}


.e7{position: absolute;left: 0;right: 0;top: 70%;width: 59%;margin: 0 auto;z-index: 1;}
.e8{position: absolute;left: 0;right: 0;top: 76%;width: 44.54%;margin: 0 auto;z-index: 1;}
.e7_f{position: absolute;left: 0;right: 0;top: 70%;width: 59%;margin: 0 auto;z-index: 1;}
.e8_f{position: absolute;left: 0;right: 0;top: 74%;width: 59%;margin: 0 auto;z-index: 1;}

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

.e9{position: relative;left: 0%;right: 0%;top: 65.3%;width: 60.8%;margin: 10% auto 3% auto;z-index: 0;}
.e10{position: relative;left: 0%;right: 0%;top: 80.3%;width: 22.35%;margin: 0 auto 0 13%;z-index: 1;}


.e11-e13{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: -19% 0 6% 8%;
    z-index: 1;
}
.e11-e13 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 44.1%;
    align-items: center;
}
.e11-e13 li{
    width: 28.9%;
}
.e11-e13 li img{ width:100%;}

.logo{position: absolute;top: 0%;width: 8.3%;right: 17.2%;margin: 0 auto;z-index: 1;}

.e11{position: absolute;top: 10%;width: 44.6%;left: 19.5%;margin: 0 auto;z-index: 1;}
.e12{position: absolute;top: 20.0%;width: 46.05%;left: 20%;margin: 0 auto;z-index: 1;}
.e13{position: absolute;left: 0;right: 0;top: 22.5%;width: 65.7%;margin: 0 auto;z-index: 0;mix-blend-mode: multiply;}
.e14{position: relative;top: 0;width: 34.75%;left: 0;right: 0;margin: -4% 25% 0 auto;z-index: 2;}
.e15{position: relative;top: 58.5%;width: 66.65%;left: 0;right: 0;margin: -21.65% auto 6% auto;z-index: 0;}
.e16{position: relative;right: 0;left: 0;top: 0;width: 50.6%;margin: 0% auto 3% auto;z-index: 0;}

.e17{position: relative;top: 0;width: 45.0%;left: 0;right: 0;margin: 0 auto 5% auto;z-index: 1;}
.e18{position: relative;top: 20.0%;width: 65.3%;left: 0;right: 0;margin: 0 auto 5% auto;z-index: 1;}
.e19{position: relative;top: 33%;width: 59%;left: 0;right: 0;margin: 0 auto 10% auto;z-index: 2;}

.e20{position: relative;top: 0;width: 66.65%;left: 0;right: 0;margin: 8% auto 5% auto;z-index: 1;}
.e21{position: relative;top: 0;width: 66.65%;left: 0;right: 0;margin: 0 auto 8% auto;z-index: 1;}
.e22{position: absolute;top: 21.3%;width: 39%;left: 22.4%;margin: 0 auto;z-index: 2;}

.logo2{position: absolute;top: 0%;width: 8.3%;left: 19.0%;margin: 0 auto;z-index: 1;}

.e23{position: absolute;top: 12.5%;width: 20%;right: 19%;margin: 0 auto;z-index: 1;}
.e24{position: absolute;left: -16%;right: 0;top: 38%;width: 39%;margin: 0 auto;z-index: 1;}
.e25{position: absolute;top: 16%;width: 63.0%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e26{position: absolute;top: 7%;width: 60.0%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e27{position: relative;left: 0;right: 0;top: 80.3%;width: 36.4%;margin: 10% auto 0 auto;z-index: 0;}


.white_box{position: relative;left: 0;right: 0;top: 87.0%;width: 65.3%;margin: 0 auto 10% auto;z-index: 0;border: solid 11px #000;border-radius: 10px;background: #FFF;}
.e28{position: relative;left: 0;right: 0;top: 87.0%;width: 86.0%;margin: 7% auto 7% 4.5%;z-index: 0;}
.e29-e32{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e29-e32 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e29-e32 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e29-e32 li img{ width:100%;}
.e29-e32 a{
    display: block;
    width: 100%;
    border: solid 6px #000;
    background: #fef8d4;

    border-radius: 10px;
}
.e29-e32 a img{    padding: 14% 33.4%;}
.e29-e32 a:hover{ background:#f05776;}
.e29-e32 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}


.e33{position: relative;left: 0;right: 0;top: 87.0%;width: 85.3%;margin: 7% auto 7% 4.5%;z-index: 0;}



.e38{position: relative;left: 0;right: 0;top: 87.0%;width: 17.5%;margin: -7% auto 8% 17.5%;z-index: 0;}

.e39{position: relative;left: 0;right: 0;top: 87.0%;width: 92%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e40-e43{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e40-e43 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e40-e43 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e40-e43 li img{ width:100%;}
.e40-e43 a{
    display: block;
    width: 100%;
    border: solid 6px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e40-e43 li:nth-child(1) a img{padding: 14% 15.5%;}
.e40-e43 li:nth-child(2) a img{padding: 14% 28.6%;}
.e40-e43 li:nth-child(3) a img{padding: 14% 22.3%;}
.e40-e43 li:nth-child(4) a img{padding: 14% 17.4%;}

.e40-e43 a:hover{ background:#f05776;}
.e40-e43 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}



.e44{position: relative;left: 0;right: 0;top: 87.0%;width: 85.3%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e45-e48{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e45-e48 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e45-e48 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e45-e48 li img{ width:100%;}
.e45-e48 a{
    display: block;
    width: 100%;
    border: solid 6px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e45-e48 li:nth-child(1) a img{padding: 14% 12.5%;}
.e45-e48 li:nth-child(2) a img{padding: 14% 6.9%;}
.e45-e48 li:nth-child(3) a img{padding: 14% 7.3%;}
.e45-e48 li:nth-child(4) a img{padding: 14% 21.7%;}

.e45-e48 a:hover{ background:#f05776;}
.e45-e48 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}


.e49{position: relative;left: 0;right: 0;top: 87.0%;width: 90.3%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e50-e53{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e50-e53 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e50-e53 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e50-e53 li img{ width:100%;}
.e50-e53 a{
    display: block;
    width: 100%;
    border: solid 6px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e50-e53 li:nth-child(1) a img{padding: 14% 25.2%;}
.e50-e53 li:nth-child(2) a img{padding: 14% 24.9%;}
.e50-e53 li:nth-child(3) a img{padding: 14% 23.3%;}
.e50-e53 li:nth-child(4) a img{padding: 14% 21.3%;}

.e50-e53 a:hover{ background:#f05776;}
.e50-e53 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}

.e54{position: relative;top: 0;width: 40.1%;left: 0;right: 0;margin: 8% auto 2% auto;z-index: 1;}
.e55{position: relative;top: 0;width: 43.6%;left: 0;right: 0;margin: 0% auto 5% auto;z-index: 1;}
.e56{position: relative;top: 0;width: 64.1%;left: 0;right: 0;margin: 0% auto 15% auto;z-index: 1;}
.e57{position: relative;top: 0;width: 62.0%;left: 0;right: 0;margin: 0% auto 5% auto;z-index: 1;}
.e58{position: relative;top: 0;width: 43.6%;left: 0;right: 0;margin: 0% auto 10% auto;z-index: 1;}
.num{
    margin: -39.5% 55.9% 17% auto;
    position: relative;
    right: 0;
    width: 9%;
    color: #1e6ad6;
    font-size: 2.0vw;
    font-weight: bold;
    text-align: center;
}

.num2{
	font-family: "din";
	margin: -51% 41.5% 17% auto;
	position: relative;
	right: 0;
	width: 21%;
	color: #e84393;
	font-size: 6.25vw;
	font-weight: bold;
	text-align: center;
	z-index: 2;
}

.addFriend{
    width: 68%;
    margin: -1% auto 10% auto;
}

.popad {
    width: 80%;
}

.btn_push {
    animation:
        bpush 2s ease infinite normal 0s none running
    ;
    -webkit-animation:
        bpush 2s ease infinite normal 0s none running
    ;
    -ms-animation:
        bpush 2s ease infinite normal 0s none running
    ;
}
@keyframes bpush {
    0%, 30%, 60% {
        transform: scale(1.0);
    }
    15%, 45% {
        transform: scale(0.95);
    }
}
@-webkit-keyframes bpush {
    0%, 30%, 60% {
        transform: scale(1.0);
    }
    15%, 45% {
        transform: scale(0.95);
    }
}

.info_send .addFriend { margin: 5% auto 5% auto;     width: 31.2%;}
input{ width:100%;}
.line_btn img,.line_btn input,.buy_btn img
	{
		animation:
			bounce 2s ease infinite normal 0s none running
		;
		-webkit-animation:
			bounce 2s ease infinite normal 0s none running
		;
		-ms-animation:
			bounce 2s ease infinite normal 0s none running
		;
	}
	@keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}
		
	}
	@-webkit-keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}
	}


.reflection.go {
  height: 100%;
  width: 8%;
  position: absolute;
  top: -56%;
  left: -3%;
  background-color: #fff;
  opacity     :0;
  transform: rotate(45deg);
  animation: reflection 2s ease-in-out ;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflection 2s ease-in-out ;
  -moz-transform: rotate(45deg);
  -moz-animation: reflection 2s ease-in-out ;
  -ms-transform: rotate(45deg);
  -ms-animation: reflection 2s ease-in-out ;
  -o-transform: rotate(45deg);
  -o-animation: reflection 2s ease-in-out ;
}


@keyframes reflection {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
  0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
  0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
  0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
  0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}


@media screen and ( max-width:1200px )
{



}

@media screen and ( max-width:1048px )
{


}


@media screen and ( max-width:768px )
{
	html{ overflow:auto;}
	body{ margin:0px; padding:0px; width:auto; background:none; overflow:hidden;}
.content{
max-width: 100%;
    }


.pc{ display:none;}
.sp{ display:block;}

.mfrom {
    width: 100%;
    /* text-align: center; */
    outline: 0;
    border: #231815 2px solid;
    color: #a6a8a8;
    font-size: 3.4vw;
    margin: 0 auto 5% auto;
    padding: 1.5% 3%;
}


.parallax {
  width: 100%;

	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment:inherit;
	text-align: center;
}

.parallax.bg-01 {
	background-image: url(../img/s011.jpg);
}
.parallax.bg-02 {
	background-image: url(../img/s013.jpg);
}
.main_animation {
    margin: 0 auto;
	width:100% !important;
	height:auto !important;
}
.main_animation canvas{
	width: 200% !important;
	height:auto !important;
	margin: 0 -50%;
}

.p1{
	background: url(../img/001.jpg) no-repeat;
	background-position: center top;
	background-size: 200% auto;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p1:before{
    content: "";
    display: block;
     /* 1:1 */
    padding-top: 160%;
    }

.p1h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	

.p2{
	background: #fef8d4;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p2:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p2h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	
	
.p3{
	background: #FFF;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p3:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p3h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p4{
	background: url(../img/001.jpg) no-repeat;
	background-position: center top;
	background-size: 185% auto;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p4:before{
    content: "";
    display: block;
     /* 1:1 */
    padding-top: 160%;
    }

.p4h{
    height:auto;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }

.p5{
	background: url(../img/005.jpg) no-repeat;
	background-position: center top;
	background-size: cover;
	background-attachment: fixed;
	position:relative;
	height: auto;
	margin: 0;
	z-index: 2;
	}
.p5:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p5h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	
.p6{
	background: #FFF;
	position:relative;
	height: auto;
	margin: 0 0 0 0;
	}
.p6:before{
    content: "";
    display: block;
     /* 1:1 */
    }

.p6h{
    height:auto;
    padding: 0;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    width: 100%;
    height: 100%;
    margin:0 auto;
    }
	


.cl{background: #505050;color:#FFF;padding:1% 0;}


.p1 img,.p2 img,.p3 img,.p4 img,.p5 img,.p6 img,.p7 img,.p8 img,.p9 img,.p10 img,.p11 img,.p12 img,.p13 img,.p14 img,.p15 img,.p16 img,.p17 img,.p18 img,.p19 img,.p20 img,.p21 img,.p22 img,.p23 img,.t1 img,.w01 img,.t2 img,.t3 img,.t4 img,.t5 img,.t6 img,.t7 img,.t8 img,.p21 img,.p22 img,.p23 img,.p24 img,.p25 img,.p26 img{ width:100%;}
.addFriend input{ width:100%;}


.form_box1{position: absolute;top: 63%;width: 55.3%;left: 0%;right: 0%;margin: 0% auto 0% auto;z-index: 1;}
.form_box1 input{
    width: 100%;
    height: 0%;
    text-align: center;
    border-radius: 0;
    outline: 0;
    border: #aaa 2px solid;
    color: #666;
    font-size: 2.2vw;
    margin: 0 auto 3% auto;
    padding: 3% 5%;
}

.main_animation{ margin:0 auto;}

.e1{position: absolute;left: 0;right: 0;top: 4%;width: 72.4%;margin: 0 auto;z-index: 1;}
.e2{position: absolute;top: 11.5%;width: 72%;left: 9.4%;margin: 0 auto;z-index: 2;}
.e3{position: absolute;left: 0;right: 0;top: 29%;width: 82%;margin: 0 auto;z-index: 1;}
.e4{position: absolute;top: 9.6%;width: 29%;right: 5%;margin: 0 auto;z-index: 1;}
.e5{position: absolute;top: 8.3%;width: 95%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e6{position: absolute;top: 40.5%;width: 98%;left: 0;right: 0;margin: 0 auto;z-index: 0;}

.e7{position: absolute;left: 0;right: 0;top: 73%;width: 95%;margin: 0 auto;z-index: 1;}
.e8{position: absolute;left: 0;right: 0;top: 79%;width: 95%;margin: 0 auto;z-index: 1;}
.e7_f{position: absolute;left: 0;right: 0;top: 70%;width: 95%;margin: 0 auto;z-index: 1;}
.e8_f{position: absolute;left: 0;right: 0;top: 76%;width: 95%;margin: 0 auto;z-index: 1;}

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

.e9{position: relative;left: 0%;right: 0%;top: 65.3%;width: 90%;margin: 10% auto 2% auto;z-index: 0;}
.e10{position: relative;left: 2.5%;right: 0%;top: 80.3%;width: 32.35%;margin: 0 auto 0 -7%;z-index: 1;}


.e11-e13{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: -30% 0 6% 10%;
    z-index: 1;
}
.e11-e13 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 68.1%;
    align-items: center;
}
.e11-e13 li{
    width: 28.9%;
}

.e11-e13 li img{ width:100%;}

.logo{position: absolute;top: 0%;width: 8.3%;right: 17.2%;margin: 0 auto;z-index: 1;}

.e11{position: absolute;top: 10%;width: 44.6%;left: 19.5%;margin: 0 auto;z-index: 1;}
.e12{position: absolute;top: 20.0%;width: 46.05%;left: 20%;margin: 0 auto;z-index: 1;}
.e13{position: absolute;left: 0;right: 0;top: 22.5%;width: 65.7%;margin: 0 auto;z-index: 0;mix-blend-mode: multiply;}
.e14{position: relative;top: 0;width: 62.75%;left: 0;right: 0;margin: -4% 8% 0 auto;z-index: 2;}
.e15{position: relative;top: 58.5%;width: 95%;left: 0;right: 0;margin: -29.9% auto 6% auto;z-index: 0;}
.e16{position: relative;right: 0;left: 0;top: 0;width: 90%;margin: 0% auto 3% auto;z-index: 0;}

.e17{position: relative;top: 0;width: 90%;left: 0;right: 0;margin: 0 auto 5% auto;z-index: 1;}
.e18{position: relative;top: 20.0%;width: 95%;left: 0;right: 0;margin: 0 auto 5% auto;z-index: 1;}
.e19{position: relative;top: 33%;width: 85%;left: 0;right: 0;margin: 0 auto 10% auto;z-index: 2;}

.e20{position: relative;top: 0;width: 94%;left: 0;right: 0;margin: 8% auto 5% auto;z-index: 1;}
.e21{position: relative;top: 0;width: 95%;left: 0;right: 0;margin: 0 auto 8% auto;z-index: 1;}
.e22{position: absolute;top: 20.5%;width: 59.95%;left: 7.8%;margin: 0 auto;z-index: 2;}

.logo2{position: absolute;top: 0%;width: 8.3%;left: 19.0%;margin: 0 auto;z-index: 1;}

.e23{position: absolute;top: 12%;width: 30%;right: 2%;margin: 0 auto;z-index: 1;}
.e24{position: absolute;left: -24%;right: 0;top: 35%;width: 59.8%;margin: 0 auto;z-index: 1;}
.e25{position: absolute;top: 17%;width: 95%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e26{position: absolute;top: 5.5%;width: 90%;left: 0;right: 0;margin: 0 auto;z-index: 0;}
.e27{position: relative;left: 0;right: 0;top: 80.3%;width: 90%;margin: 30% auto 0 auto;z-index: 0;}


.white_box{position: relative;left: 0;right: 0;top: 87.0%;width: 97%;margin: 0 auto 40% auto;z-index: 0;border: solid 6px #000;border-radius: 10px;background: #FFF;}
.e28{position: relative;left: 0;right: 0;top: 87.0%;width: 86.0%;margin: 7% auto 7% 4.5%;z-index: 0;}
.e29-e32{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e29-e32 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e29-e32 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e29-e32 li img{ width:100%;}
.e29-e32 a{
    display: block;
    width: 100%;
    border: solid 4px #000;
    background: #fef8d4;
    border-radius: 10px;
}
.e29-e32 a img{    padding: 14% 33.4%;}
.e29-e32 a:hover{ background:#f05776;}
.e29-e32 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}


.e33{position: relative;left: 0;right: 0;top: 87.0%;width: 85.3%;margin: 7% auto 7% 4.5%;z-index: 0;}



.e38{position: relative;left: 0;right: 0;top: 87.0%;width: 37.5%;margin: -34% auto 28% 3.5%;z-index: 0;}

.e39{position: relative;left: 0;right: 0;top: 87.0%;width: 89.4%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e40-e43{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e40-e43 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e40-e43 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e40-e43 li img{ width:100%;}
.e40-e43 a{
    display: block;
    width: 100%;
    border: solid 4px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e40-e43 li:nth-child(1) a img{padding: 14% 15.5%;}
.e40-e43 li:nth-child(2) a img{padding: 14% 28.6%;}
.e40-e43 li:nth-child(3) a img{padding: 14% 22.3%;}
.e40-e43 li:nth-child(4) a img{padding: 14% 17.4%;}

.e40-e43 a:hover{ background:#f05776;}
.e40-e43 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}



.e44{position: relative;left: 0;right: 0;top: 87.0%;width: 85.3%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e45-e48{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e45-e48 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e45-e48 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e45-e48 li img{ width:100%;}
.e45-e48 a{
    display: block;
    width: 100%;
    border: solid 4px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e45-e48 li:nth-child(1) a img{padding: 14% 12.5%;}
.e45-e48 li:nth-child(2) a img{padding: 14% 6.9%;}
.e45-e48 li:nth-child(3) a img{padding: 14% 7.3%;}
.e45-e48 li:nth-child(4) a img{padding: 14% 21.7%;}

.e45-e48 a:hover{ background:#f05776;}
.e45-e48 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}


.e49{position: relative;left: 0;right: 0;top: 87.0%;width: 90.3%;margin: 7% auto 7% 4.5%;z-index: 0;}

.e50-e53{
    position: relative;
    left: 0%;
    top: 0;
    width: 100%;
    margin: 4% auto 6% auto;
    right: 0%;
    z-index: 1;
}
.e50-e53 ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 90.9%;
    align-items: center;
}
.e50-e53 li{
    width: 47.9%;
    margin: 0 0 5% 0;
}
.e50-e53 li img{ width:100%;}
.e50-e53 a{
    display: block;
    width: 100%;
    border: solid 4px #000;
    background: #fef8d4;

    border-radius: 10px;
}

.e50-e53 li:nth-child(1) a img{padding: 14% 25.2%;}
.e50-e53 li:nth-child(2) a img{padding: 14% 24.9%;}
.e50-e53 li:nth-child(3) a img{padding: 14% 23.3%;}
.e50-e53 li:nth-child(4) a img{padding: 14% 21.3%;}

.e50-e53 a:hover{ background:#f05776;}
.e50-e53 a img:hover{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(229deg) brightness(150%) contrast(150%);}

.e54{position: relative;top: 0;width: 90%;left: 0;right: 0;margin: 8% auto 2% auto;z-index: 1;}
.e55{position: relative;top: 0;width: 90%;left: 0;right: 0;margin: 0% auto 5% auto;z-index: 1;}
.e56{position: relative;top: 0;width: 90%;left: 0;right: 0;margin: 0% auto 15% auto;z-index: 1;}
.e57{position: relative;top: 0;width: 95%;left: 0;right: 0;margin: 0% auto 5% auto;z-index: 1;}
.e58{position: relative;top: 0;width: 90%;left: 0;right: 0;margin: 0% auto 10% auto;z-index: 1;}
.num{
    margin: -41.8% 52.6% 23% auto;
    position: relative;
    right: 0;
    width: 15%;
    color: #1e6ad6;
    font-size: 9vw;
    font-weight: bold;
    text-align: center;
}


.num2{
	font-family: "din";
	margin: -55% 37.5% 17% auto;
	position: relative;
	right: 0;
	width: 28%;
	color: #e84393;
	font-size: 23.5vw;
	font-weight: bold;
	text-align: center;
	z-index: 2;
}

.popad {
    width: 60%;
    margin: 0 auto;
    display:block;
}


.iPhone .num2{margin: -53.3% 37.5% 17% auto;}

}

@media screen and ( max-width:600px )
{


}

@media screen and ( max-width:425px )
{

}


@media screen and ( max-width:393px )
{
}


@media screen and ( max-width:375px )
{
	

}

@media screen and ( max-width:360px )
{


}

@media screen and ( max-width:320px )
{


}




  .loop_css2 {
    position: relative;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    width: 100vw;
    overflow: hidden;
	margin-bottom:8%;
  }

  .loop_css2 ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    width: 100%;
    margin: 0 0px 0 0px;
    padding: 0;
  }

  .loop_css2 li {
    display: inline-block;
    width: calc(100vw / 2);
    min-width: 150px;
    margin: 0 10px 0 0;
    list-style: none;
    text-align: center;
  }

  .loop_css2 li a {
    display: block;
  }

  .loop_css2 li img {
    display: block;
    width: 100%;
    height: auto;
  }

  .loop_css2 li a:hover {
    opacity: .7;
  }

  .loop_css2 ul:first-child {
    -webkit-animation: loop 50s -25s linear infinite;
    animation: loop 50s -25s linear infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
  }

  .loop_css2 ul + ul {
    -webkit-animation: loop2 50s  linear infinite;
    animation: loop2 50s linear infinite;
  }
  

  @-webkit-keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
    }
  }

  @keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
    }
  }

  @-webkit-keyframes loop2 {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
    to {
      -webkit-transform: translateX(-200%);
      -ms-transform: translateX(-200%);
      transform: translateX(-200%);
    }
  }

  @keyframes loop2 {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
    to {
      -webkit-transform: translateX(-200%);
      -ms-transform: translateX(-200%);
      transform: translateX(-200%);
    }
  }
  
@media screen and ( max-width:768px )
{
	  .loop_css2 ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    width: 100%;
    margin: 0 -55px 0 0px;
    padding: 0;
  }
}



/*--------------------------------------------------------
//サンキュー用レイアウト
--------------------------------------------------------*/





/*--------------------------------------------------------
//特定商用レイアウト
--------------------------------------------------------*/


 /* モーダル全体 */
    #ageModal {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      backdrop-filter: blur(10px); /* 背景にガウスぼかしを適用 */
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 1000;
      visibility: hidden;
      opacity: 0;
      transition: visibility 0s, opacity 0.3s ease-in-out;
    }

    #ageModal.actives {
      visibility: visible;
      opacity: 1;
    }

    /* モーダルのコンテンツ */
    .modal-content {
      background: rgba(255, 255, 255, 0.95);
      padding: 30px;
      text-align: center;
      border-radius: 15px;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
      max-width: 400px;
      width: 90%;
    }

    .modal-content h2 {
      margin-top: 0;
      color: #333;
      font-size: 22px;
      font-weight: bold;
    }

    .modal-content p {
      font-size: 16px;
      color: #555;
      line-height: 1.5;
    }

    /* ボタンのスタイル */
    .modal-content button {
      margin: 30px 10px 0;
      border: none;
      border-radius: 25px;
      font-size: 18px;
      cursor: pointer;
      transition: transform 0.2s ease, background-color 0.3s ease;
    }

    /* 「はい」ボタン */
    .btn-yes {
      padding: 20px 40px; /* サイズを大きく */
      background-color: #4caf50;
      color: white;
      font-size: 20px;
      animation: pulse 1.2s infinite; /* 新しいアニメーション */
		width: 90%;
    }

    .btn-yes:hover {
      background-color: #4caf50;
      transform: scale(1.1); /* ホバー時に拡大 */
    }

    /* 「いいえ」ボタン */
    .btn-no {
      padding: 10px 20px; /* サイズを小さく */
      background-color: gray;
      color: white;
      font-size: 16px; /* フォントサイズを小さく */
    }

    .btn-no:hover {
      background-color: gray;
    }

    /* ボタンの新しいアニメーション */
    @keyframes pulse {
      0% {
        transform: scale(1);
        box-shadow: 0 0 10px rgba(76, 175, 80, 0.4);
      }
      50% {
        transform: scale(1.15);
        box-shadow: 0 0 25px rgba(76, 175, 80, 0.7);
      }
      100% {
        transform: scale(1);
        box-shadow: 0 0 10px rgba(76, 175, 80, 0.4);
      }
    }
	.top5{
		margin-top: 5%;
	}