/*================================================
	初期設定
================================================*/

/* リセット */
* { margin:0; padding:0; }
/* clearfix（回り込み解除） */
*:after { display:block; clear:both; }
/* はみ出し対策 */
body {
	width:100%;
	margin:0;
	padding:0;
	font-family:sans-serif;
	-webkit-text-size-adjust: none;
	font-size: 15px;
  color: #ffffff;
  background-size: 100%;
  font:16px/1.6 Arial,Roboto,"Droid Sans","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
  -webkit-text-size-adjust: 100%;
}
/* HTML5に対応していないOS対策 */
article, aside, figure, footer, header,hgroup, nav, section { display:block; }

/* 画像下の変な余白削除 */
img { vertical-align: top; max-width:100%;
height: auto;}

/* ボタンの形統一 */
input[type="submit"] {
	margin-top:-10px;
	font-size:15px;
	padding:7px;
	text-align:center;
	border:1px solid #AAA;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	-ms-border-radius:3px;
	border-radius:3px;
	background:-webkit-gradient(
		linear,
		0% 100%,
		0% 21%,
		from(#E6E6E6),
		to(#FFF),
		color-stop(.5,#E6E6E6)
	);
	background:-moz-linear-gradient(
		0% 75% 90deg,
		#E6E6E6,
		#FFF,
		#FFF 100%
	);
	box-shadow:0 2px 2px rgba(100, 100, 100, 0.15);
	-moz-box-shadow:0 2px 2px rgba(100, 100, 100, 0.15);
	-webkit-box-shadow:0 2px 2px rgba(100, 100, 100, 0.15);
	text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.9);
}
/* 統一 
form select {
	font-size:16px;
	height:30px;
}*/
input[type="text"] {
	font-size:16px;
	height:30px;
	width:300px;
	ime-mode:active;
}

html{
max-width:100%;
margin:0 auto;
}

/*================================================
	基本的なアンカー設定
================================================*/
/* リンク設定 */
.str_color{
color: #ffca54;
}

/* Link Color */

a:link{
color:#FFE378;
}

a:visited{
color:#FFE378;
}

a:active{
color:#FFE378;
}

/* Android Tap Non-Display */
a,input {
-webkit-tap-highlight-color: rgba(219, 93, 74, 0.4);
}



/*---------------------------------------
  js部分
---------------------------------------*/
#wrapp_form{
  width: 85%;
  position: relative;
  margin: 0 auto;
}
.topimage {
  position: relative;
  background: url(../img/top_bg.jpg);
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.title {
    margin: 0 auto;
    position: relative;
    z-index: 999;
    top: 1rem;
}
.first{
  position:absolute;
  top: -4rem;
  width:100%;
}
.enter_area{
  position: relative;
  width: 100%;
  height: 100%;
  padding: 100% 0 0;
  z-index: 9;
}
.enter_btn {
    position: absolute;
    top: 100px;
    left: 0;
    right: 0;
    width: 260px;
    height: 155px;
    margin: 0 auto;
}
.enter_txt{
  position:absolute;
  width:98%;
  right:0;
  text-align:center;
  letter-spacing:1px;
}
.txt_01 {
    top: 355px;
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 9;
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #fff;
}


.txt_02 {
    top: 110px;
    font-size: 15px;
    font-weight: bold;
    position: absolute;
    z-index: 5;
    left: 0;
    right: 0;
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #fff;
    transform: translate3d(0px, 0px, 50px);
}

@-webkit-keyframes rotate{
  0%{-webkit-transform: translate(0,0px);}
  100%{-webkit-transform: translate(0,-10px);}
}

@keyframes fuwafuwa {
    0% {transform: translate(0,0px);}

    100% {transform: translate(0,-5px);}
    }

.arrow {
    animation-name: fuwafuwa;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-duration: 0.5s;
    display: block;
    margin: 0 auto;
    width: 35%;
    position: absolute;
    left: 0;
    right: 0;
    top: -28px;
}


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

.charge_step img,.charge_end,.circle_top,.circle_middle,.rolling,.circle_bottom{
  position:absolute;
  top: -20px;
}
.charge_end{
  display:none;
}
.circle_middle,.rolling,.circle_bottom,.charge_step img{
  opacity:0;
}

.charge_step img {
    z-index: 1;
    left: 0;
    right: 0;
    top: 80px;
    width: 91%;
    margin: 0 auto;
    padding-left: 2%;
}
.charge_end_txt{
  display:none;
  position:absolute;
  width:100%;
  margin-top: 380px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align:center;
  font-weight:bold;
  font-size:16px;
  z-index: 3;
  color: #ffffff;
    text-shadow: 0px 0px 6px #0A360F, 0px 0px 6px #0A360F, 0px 0px 6px #0A360F, 0px 0px 5px #fff;
}

.circle_light img{
  width:25%;
}
@-webkit-keyframes rotate{
  0%{-webkit-transform: rotate(90deg);}
  100%{-webkit-transform: rotate(450deg);}
}
@keyframes rotate{ 
  0%{transform:rotate(90deg);}
  100%{transform: rotate(450deg);}
}
.flash{
  display:none;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  width:100%;
  height:100%;
  margin:auto;
  background:#fff;
  -webkit-animation: flash 2s;
  animation:flash 2s;
  -webkit-animation-fill-mode: flash 2s;
  animation-fill-mode:forwards;
  z-index:10;
}
@-webkit-keyframes flash{
  0%  {-webkit-transform: scale(1,1);}
  100%{-webkit-transform: scale(10,10);}
}
@keyframes flash{
  0%  {transform: scale(1,1);}
  100%{transform: scale(10,10);}
}


p.aura_main2 img{
    width: 160px;
    position: absolute;
    left:0;
    right: 0;
    top:0;
    margin: 0 auto;

}

p.crystal_top img {
    position: absolute;
    left: 0;
    right: 0;
    width: 91%;
    top: 80px;
    margin: 0 auto;
}

@keyframes 'pulse' {
  0%{
        opacity:0.2;
         }
    100%{
        opacity:1;
         }
}
@-webkit-keyframes 'pulse' {
  0%{
        opacity:0.2;
         }
    100%{
        opacity:1;
         }
}
.flash2{
-webkit-animation-name: pulse;
-webkit-animation-duration: 1.5s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-timing-function:ease-in-out;
-webkit-animation-direction: alternate;
-webkit-animation-delay: 0s;
}
/****--------- 回転 ---------****/

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

@keyframes roll {
    from {
        transform: perspective(500px) rotateY(0deg);
    }
    50%{
        transform: perspective(500px) rotateY(180deg);
    }
    to{
        transform: perspective(500px) rotateY(360deg);
    }
}
.rolling{
  animation: spin 5s linear infinite;
  -webkit-animation: spin 5s linear infinite;
  -moz-animation: spin 5s linear infinite;
    width:240px;
    position: absolute;
    left:0;
    right: 0;
    top:-10px;
    margin: 0 auto;
    z-index: 2;
}



@media screen and (min-width: 480px) {
  body{
    margin:auto;
    background: #30551D !important;
  }
  #wrapp{
    width:480px;
    margin:auto;
    background: url(../img/form_bg.jpg) #30551D;
    background-size: 100%;
    background-repeat: repeat-y;
  }
#prof {
    min-height: auto !important;
  }
.txt_01 {
        top: 436px;
        font-size: 18px;
    }
.arrow {
    top: -36px;
    }
.enter_btn {
    width: 300px;
    height: 200px;
}
.charge_end_txt {
    margin-top: 400px;
} 
p.crystal_top img {
    top: 98px;
}

.charge_step img {
    top: 97px;

}

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


p.aura_main img{
    width: 170px;
    height: auto;

}

.enter_btn {
    top: 94px;
    width: 200px;
    height: 140px;
}

.txt_01 {
    top: 254px;
    }
.arrow {
    top: -23px;
    }
    
.charge_end_txt{
  top: 0;
  font-size: 14px;
}
.kakunin_deta {
    font-size: .9em;
}
}
/*---------------------------------------
  点滅ボタン
---------------------------------------*/
.cap_area p.Btn {
    position: absolute;
    margin: 0 auto;
    display: block;
    right: 0;
    left: 0;
    width: 90%;
    bottom: 43%;
}

.cap_area p.Btn2 {
    position: absolute;
    margin: 0 auto;
    display: block;
    right: 0;
    left: 0;
    width: 100%;
    bottom: 19%;
}

#uranauBtn img{
margin: 0 auto;
display: block;
width: 70%;
margin-top:10px;
}

p.Btn a{
width:100%;
display:block;
position:relative;
}
p.Btn a img{
width:190%;
position:absolute;
top:0;
left:0;
}


p.Btn2 a{
width:100%;
display:block;
position:relative;
}
p.Btn2 a img{
width:100%;
position:absolute;
top:0;
left:0;
}


@keyframes 'pulse2' {
  0%{
        opacity:0.2;
         }
    100%{
        opacity:1;
         }
}
@-webkit-keyframes 'pulse2' {
  0%{
        opacity:0.2;
         }
    100%{
        opacity:1;
         }
}
.flash3{
-webkit-animation-name: pulse2;
-webkit-animation-duration: 0.7s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-timing-function:ease-in-out;
-webkit-animation-direction: alternate;
-webkit-animation-delay: 0s;
}


  #wrapp{
    background: #2e542a;
    background-size: 100%;
    background-repeat: repeat-y;
  }
/*================================================
	説明
================================================*/

.cap_area {
  position: relative;

}
.cap_txt {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.cap_txt img{
  width: 90%;
  margin-top: -3%;
}
.cap1 {

}

.karte1{
    position: absolute;
}

.karte1 {
    position: absolute;
    top: 10%;
    width: 29%;
    z-index: 1;
    left: 2%;
}

.karte2 {
    position: absolute;
    top: 10%;
    width: 82%;
    right: 0;
}

/*---------------------------------------
   フォーム

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

.next_box {
  background: url(../img/form_bg.jpg);
  background-size: 100%;
  background-repeat: no-repeat;
  position: relative;
}

.next_img{
    text-align: center;
}

.next_img img {
    width: 30%;
    padding-top: 10%;
}
.arrow_txt {
  position: absolute;
}

.btn_send {
  margin-top: 9%;
}
/*---- tarot_contents ----*/
#result_Area{
position:relative;
padding:0;
margin:0;
}

.Open{
      animation-name: Open;
      -webkit-animation-name: Open;

      animation-duration: 1.2s;
      -webkit-animation-duration: 1.2s;

      animation-timing-function: ease-out;
      -webkit-animation-timing-function: ease-out;

      visibility: visible !important;
}
@keyframes Open {
      0% {
            transform: scale(1.8);
      }
      50% {
            transform: scale(0.95);
      }
      80% {
            transform: scale(1.05);
      }
      90% {
            transform: scale(0.98);
      }
      100% {
            transform: scale(1);
      }
}
@-webkit-keyframes Open {
      0% {
            -webkit-transform: scale(1.8);
      }
      50% {
            -webkit-transform: scale(0.95);
      }
      80% {
            -webkit-transform: scale(1.05);
      }
      90% {
            -webkit-transform: scale(0.98);
      }
      100% {
            -webkit-transform: scale(1);
      }
}
/*================================================
	フォーム
================================================*/



#form {
    width: 85%;
    height: auto;
    margin: 0px;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    text-align: center;
    margin: 0 auto;
    padding-bottom: 25%;
}

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

#form {

}

}

.last {
    padding-bottom: 0 !important;
}
.form_bottom {
    width: 90%;
    margin: 0 auto;
    padding-bottom: 25%;
}

.form_bottom .btn-back {
    width: 7em;
    margin: 0 auto;
    display: block;
}

#prof {
  background: url(../img/center_bg.png);
    background-repeat: repeat;
    background-size: auto;
    margin: 0 auto;
    background-size: 100%;
    background-repeat: repeat-y;
    padding: 0 3% 8%;
    position: relative;
}
.next_form #prof {
  padding-bottom: 0;
}

#contents {
    margin: 21% 5% 5%;
    background:rgba(255,255,255,0.6);
    background-repeat: repeat;
    background-size: auto auto;
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    padding: 5%;
}



#contents table {
    width: 98%;
    text-align: center;
    padding: 0 auto;
    border-collapse: collapse;
}

#contents p{
  letter-spacing:3px;
  font-weight: bold;

}
.err_text font{
  font-size: 15px;
  display: block;
  padding-top: 34px;
  color: #FFE378;
  width: 90%;
  margin: 0 auto;
}


.quest {
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(0deg, #9DFFED 0%, #cafff5 70%, #ffffff 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: -1em;
    left: 0;
    right: 0;
}

.quest2 {
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(0deg, #9DFFED 0%, #cafff5 40%, #ffffff 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: -1.5em;
    left: 0;
    right: 0;


}

.quest3 {
    font-size: 12px;
    font-weight: bold;
    background: linear-gradient(0deg, #9DFFED 0%, #cafff5 70%, #ffffff 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    left: 0;
    right: 0;

}
.form_layer {
  width: 90%;
  margin-top: 5px;
}

.quest2 .form_layer {
  margin-top: 10px;
}

.quest_end {
    font-size: 19px;
    font-weight: bold;
    background: linear-gradient(0deg, #9DFFED 0%, #cafff5 70%, #ffffff 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: -1em;
    left: 0;
    right: 0;
}

.quest_end .form_layer {

}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

#form td.back_color {
  /* background-color: rgba( 232, 233, 210, 0.1 );
  color: #fcf5c9;*/
}


p.Btn input {
    width: 100%;
    display: block;
    position: relative;
}

p.Btn input img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.p_mark {
    width: 20%;
    display: block;
    background-color: white;
    margin-left: 75%;
}

.form_nav {
    font-size: 10px;
    letter-spacing: 7px;
    color: #8d96c0;

}


 .n_btn {
    width: 90%;
    margin: 0 auto;
}

.form_nav .nav_on{
color: #a93778;
}



#contents table td {
    padding-bottom: 3px;
    font-size: 14px;
    text-shadow: 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 5px #fff;
    text-align: center;
    letter-spacing: 2px !important;
    color: #FFE378;
    font-weight: bold;
}


.ui-bar-a {
    padding: 1px 5px;
    font-size: 13px;
    text-align: left;
}


.w_txt {
    font-size: 13px;
    }

.form_txt{
    font-size: 13px;
    text-align: center;
    line-height: 1.5em;
    letter-spacing: 1px !important;

}

.form_num {
    font-size: 16px;
    font-family: serif;
}

.form_txt a:link{
color:#FFE378;
}

.form_txt a:visited{
color:#FFE378;
}

.form_txt a:active{
color:#FFE378;
}



.form_txt1 {
  font-size:12px;
  padding: 5% 3%;
  text-align: left;
  line-height: 1.5em;

}

.form_txt2 {
    font-size: 13px;
    padding: 5% 0 0;
    text-align: center;
    line-height: 1.5em;
    width: 90%;
    margin: 0 auto;
}

.form_txt3 {
    font-size: 13px;
    padding: 8% 0 3%;
    line-height: 1.8em;
    margin: 0 auto;
    text-align: left;
}
.form_txt3 a:link{
  font-weight: bold;
}


.step {
position: relative;
margin: 5%;
}
.step::before {
  content: '';
  position: absolute;
  z-index: 1;
  width: 20px; height: 20px; /* 吹き出しサイズ */
}
.step::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 0; left: 0;
  width: 100%; height: 100%;
}
.step>* {
  position: relative;
  z-index: 3;
}
.step,
.step::after {
  border-radius: 5px; /* 角の丸め方 */
}
.step,
.step::before {

}
.step,
.step::before,
.step::after {

}

/* 吹き出し・下辺中央 */
.step::before {
  bottom: -10px; left: 50%; /* 位置 */
  transform: translateX(-50%) rotate(45deg) skew(1deg,1deg); /* 傾斜角(skew) */
}

.second {
    position: relative;
    padding-bottom: 5%;
    position: relative;
    display: block;
    background: url(../img/second_bg.jpg)repeat-y;
    background-size: 100% auto;
}


.second img{
  width: 100%;
}

/*============
UNDER
============*/

.content.under{
  min-height: 92vh;
}
.header_inner{
  width: 85%;
  margin: 0 auto;
  padding: 1.5vw 5vw;
  background: url("../imgs/line.png") no-repeat center bottom/100%;
}
.txt_og{
  font-weight: bold;
  color: #ff7e00;
}
.sec-top{
  margin: 20% 5% 5%;
}
.sec-top a{
  color: #6e72ab;
}

.under h2.sec-ttl{
  font-size: 2em;
  font-weight: normal;
  margin-bottom: 1em;
}
.page-under-box{
  padding-bottom: 7vw;
  line-height: 1.6;
}

.page-under-box + .page-under-box{
  background: url("../imgs/line.png") no-repeat center top/100%;
  padding-top: 7vw;
}
.under h3.inttl{
  font-weight: bold;
  color: #ff7e00;
  padding-left: 1.14em;
  position: relative;
  line-height: 1;
  margin-bottom: .5em;
}

.under h3.inttl::before{
  content: "";
  width: .88em;
  height: .88em;
  background: #ff7e00;
  display: block;
  position: absolute;
  left: 0;
}

.page-under-box h1{
  font-weight: bold;
  color: #ff7e00;
  position: relative;
  line-height: 1;
  margin-bottom: .5em;
}
.page-under-box section {
  margin-top: 1em;
}

.page-under-box > .intxt + .inttl{
 margin-top: 1em;
}
.page-under-box > .intxt + .intxt{
  margin-top: .88em;
}
.under .intxt{
  text-align: justify;
}
ul.intxt{
  margin-left: 1.14em;
}
ul.intxt.num{
  list-style: decimal;
  margin-left: 1.88em;
}
ul.intxt.dot{
  list-style: disc;
}

/**/
p.kakunin-txt {
  margin-bottom: 5vw;
}
p.kakunin-txt a{
  font-weight: bold;
  color: #4e68ea;
}
.kakunin_deta {
   padding-top: 15%;

}
.kakunin_deta ul{
  width: 92%;
  margin: 0 auto;
  text-align: left;
}
.kakunin_deta ul li{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
  border-bottom: 1px solid #ffffff;
  padding-bottom: .3em;
}

.kakunin_deta ul li:last-child{
     border:none;
}

.kakunin_deta ul li + li{
  padding-top: .3em;
}
.kakunin_deta ul li p.f-ttl{
  width: 30%;
  font-weight: bold;
}
.kakunin_deta ul li p.f-deta{

}
.kakunin_deta ul li > p + p::before{
  content: "";
  padding-right: 1em;
  font-weight: bold;
}
.send-btn{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  margin-top: 5vw;
}
.send-btn input[type="submit"]{
  width: 80%; 
  height: 16vw; 
  background: url("../imgs/btn_send.png") no-repeat bottom/100%;
  border: none;}


.p_mark2 {
    display: block;
    background-color: white;
    margin: 0 auto;
    color: #000;
    text-shadow: none;
    margin-top: 5%;
}

.p_mark2 #p1 {
    display: block;
    padding: 5px;
    text-align: center;
}
.p_mark2 #p1 img {
    width: auto;
}

.p_mark2 p {
    font-size: 13px;
    padding: 2%;
    text-align: left;
    background: gainsboro;
}
/*---------------------------------------
     other
---------------------------------------*/


#second {
  background: url(../img/center_bg.png);
    background-repeat: repeat;
    background-size: auto;
  background-repeat: repeat;
  background-size: auto;
  margin: 0 auto;
  background-size: 100%;
  background-repeat: repeat-y;
  position: relative;
  padding: 0 7%;
}


.h2 {
    font-family: serif;
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    letter-spacing: 0.05rem;
    padding: 10% 5% 5%;
    text-shadow: 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #0A360F, 0px 0px 5px #fff;
}

#write{
    text-align: left;
    width: 85%;
    height: auto;
    margin: 0px;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    margin: 0 auto;
}


#write h1{
font-size:14px;
font-weight:bold;
padding: 10px 0 2px 0;
letter-spacing:0.1em;
margin-bottom: 5px;
}

#write p.w_txt{
line-height:1.4;
letter-spacing:0.1em;
font-size:13px;
padding-bottom: 1em;
}

#write h2{
font-size:13px;
font-weight:bold;
letter-spacing:0.1em;
line-height:1.4;
padding: 5px 0 5px 0;
}

.less {
  padding-bottom: 10%;
}

/* profile3 */

#caption{
background:#73524c;
text-align:center;
color:#ffffff;
margin: 20px 0 3px 0;
}


/* kanteishi */

#kanteishi {
    padding: 0 5%;
}

#kanteishi article{
margin:0 0 15px 0;
}

#kanteishi article h3{
font-size: 15px;
color:#c23bbd;
font-weight:bold;
margin: 0 0 10px 0;
padding:0 0 0 2px;
letter-spacing:0.1em;
}

#kanteishi article:last-child{
margin:0;
}

#kanteishi article section{
padding:0 0 10px 0;
}

#kanteishi article section p{
font-size:12px;
line-height:1.6;
}

#kanteishi article section p img{
float:left;
width:100px;
margin:0 10px 6px 0;
}

#kanteishi article section p:after{
content:"";
display:block;
clear:both;
}

#kanteishi article p.w_txt{
line-height:1.4;
font-size: 12px;
}

#kanteishi article p.w_txt a{
display:block;
padding:10px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
background: #cc269f; /* Old browsers */
background: -moz-linear-gradient(top,  #cc269f 1%, #9f157a 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#cc269f), color-stop(100%,#9f157a)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #cc269f 1%,#9f157a 100%); /* Chrome10+,Safari5.1+ */
background: -ms-linear-gradient(top,  #cc269f 1%,#9f157a 100%); /* IE10+ */
background: linear-gradient(to bottom,  #cc269f 1%,#9f157a 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e98e23', endColorstr='#e1c731',GradientType=0 ); /* IE6-9 */
-webkit-border-radius:0.4em;
border-radius:0.4em;
/*-webkit-box-shadow:1px 1px 3px #333;
box-shadow:1px 1px 3px #333; */
width:100%;
text-align:center;
text-decoration:none;
font-weight:bold;
font-size:14px;
color:#fff;
}

/*---------------------------------------
     サポートメニュー
---------------------------------------*/


#support{
background-size: 100%;
background-repeat: no-repeat;
margin-top: 5%;
}

#support ul{
 margin:0 auto;
 list-style: none;
}

#support ul li{
}

#support ul li a{
position: relative;
display: block;
height: 44px;
margin: 0px 5%;
padding: 0 15%;
font-size: 14px;
font-weight: bold;
color: #fff;
text-decoration: none;
text-indent: 10px;
line-height: 44px;
background: -webkit-gradient(linear,left top, left bottom,color-stop(1.00,#9a7269),color-stop(0.00,#67463e));
background: -webkit-linear-gradient(top, #9a7269 0%, #67463e 100%);
background: -moz-linear-gradient(top, #9a7269 0%, #67463e 100%);
background: linear-gradient(top, #9a7269 0%, #67463e 100%);
border-radius: 5px;
-webkit-border-radius: 5px;
/*text-shadow: 1px 1px 0 rgba(118, 88, 120, 0.9);*/
}

#support ul li a:after{
position: absolute;
    right: 2%;
    top: 25%;
    margin: -5px 0 0 0;
    display: block;
    content: "";
    width: 35px;
    height: 35px;
    background: url(../img/allow.png) no-repeat;
        background-size: auto auto;
    -webkit-background-size: 20px;
    background-size: 35px;

}


/* beginner */
#support ul li.beginner a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/star.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* Agree */
#support ul li.Agree a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/3line.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* payment */
#support ul li.payment a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/yen.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* privacy */
#support ul li.privacy a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/key.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* specific */
#support ul li.specific a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/exc.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* company */
#support ul li.company a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/company.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* drawal */
#support ul li.drawal a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/punish.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* info */
#support ul li.info a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/m.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/* shokai */
#support ul li.shokai a:before{
position:absolute;
left:2%;
top:30%;
margin:-9px 0 0 0;
display:block;
content:"";
width:40px;
height:40px;
background:url(../img/shokai.png) no-repeat;
-webkit-background-size:40px;
background-size:40px;
}

/*---------------------------------------
     tokusyo_payment
---------------------------------------*/

#tokusyo_pay{
padding:0 auto;
}

#tokusyo_pay ul{
width:100%;
text-align:center;
margin:10px auto;
list-style-type:none;
}

#tokusyo_pay ul:after{
display:block;
content:"";
clear:both;
}


#tokusyo_pay ul li{
float:left;
width:25%;
margin:0 0 10px 0;
}

#tokusyo_pay ul li:nth-child(4n){
margin:0 0 10px 0;
}

/* ページトップボタン */

html {
    scroll-behavior: smooth;
}


#page_top {
    height: 56px;
    width: 56px;
    position: fixed;
    right: 10px;
    bottom: 20px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;

}


#page_top::before {

font-weight: 900;
content: '';
font-size: 50px;
color: #ffffff;
position: absolute;
top: 24%;
left: 50%;
translate: -50%;
    height: 10px;
    width: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: translateY(20%) rotate(-45deg);

}

#page_top::after {
content: 'TOP';
font-size: 11px;
color: #fff;
position: absolute;
margin: auto;
text-align: center;
width: 100%;
top: 45%;
left: 50%;
translate: -50%;
letter-spacing: 0.1rem;

}

/*---------------------------------------
     footer
---------------------------------------*/

.footer {
  max-width: 750px;
  margin: 0 auto;
  padding: 0 2%;
  background: #30551D;
  text-align: center;
  color: #fff;
  position: absolute;
  width: 100%;
  bottom: -22em;
}
.footer2 {
  position: unset !important;

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

.footer {
  bottom: -27em;
}

}
.footer small {
  display: block;
  padding: 3.2% 0 3.6%;
  font-size: 70%;
}

.footer_item {
  border-bottom: 1px solid #fff;
}

.footer_item a {
  display: block;
  padding: 3.2% 0;
  color: #fff;
}

.footer_copy {
  display: block;
  padding: 2% 0;
}