@charset "utf-8";
body,div,pre,blockquote,form,fieldset,input,textarea,select,option,dl,dt,dd,ol,li,h1,h2,h3,h4,h5,h6,table,th,td,embed,object,img,figure {
  margin: 0;
  padding: 0;
}
article,aside,canvas,details,figcaption,figure,header,footer,main,menu,nav,section,summary {
  display: block;
}
*,
*:before,
*:after{
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
html{
  font-size: 62.5%;
  position: relative;
  overflow: auto;
  /*background gradient*/
  min-height: 100%;
}
body{
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  color: hsla(0,0%,0%,0.80);
  font-size: 1.6rem;
  line-height: 1.5;
  background-size: 100% auto !important;
  background: #fff2d9 url("../../img/pc/index/bg.png") no-repeat center top;
  overflow: hidden;/*over_wrap*/
}
#wrap{
  width: 980px;
  margin: 0 auto;
  /*footer btm fix*/
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
/*lp media*/
@media screen and (max-width: 980px) {
  #wrap{width: 100%;}
  img{max-width: 100%;}
}
main{
  margin: 3rem 0;
}

.over_width{
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding-right: calc(50vw - 50%);
  padding-left: calc(50vw - 50%);
}
.over_wrap{
  width: calc(100vw);
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}

/*=========================================
site link color
=========================================*/
a{
  color: #BF1313;
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}


/*=========================================
title
=========================================*/
h2,h3,h4,h5,h6{
  font-style: normal;
  font-weight: normal;
  font-size: 1.8rem;
  margin: 2rem 0;
}

h2 {
    display: flex;
    align-items: center;
    padding: .5em .7em;
    background-color: #FFAD27;
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
}
h2::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #e8800d;
    content: '';
}

/*小見出し*/
h3 {
  padding: .3em;
  border-bottom: 1px solid #F1A529;
  font-size: 2rem;
  font-weight: bold;
}
/*注意文言内見出し*/
h4{
}


/*=========================================
common
=========================================*/
img, figure, video{
  border: none;
  vertical-align: bottom;
}
hr{
  height: 0;
  padding: 0;
  border: 0;
  margin: 10px 0;
  border-top: 1px solid rgba(0,0,0,0.9);
  border-bottom: 1px solid rgba(255,255,255,0.3);
}
.width_full{
  width: -webkit-fill-available;
  width: -moz-available;
}
pre {
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: inherit;
}

/* plan
--------------------------------------------------*/
.view_plan{text-align: center;}
.view_plan img{max-width: 100%;}

/* table common
--------------------------------------------------*/
table img{vertical-align: bottom;}
table.tbl_fixed{table-layout: fixed;}

/* dl_base common
--------------------------------------------------*/
/*商品説明用*/
dl.dl_base dd:empty{display: none;}

/* text
--------------------------------------------------*/
div[class^="txt_"],
span[class^="txt_"],
p[class^="txt_"]{
  vertical-align: middle;
}
.txt_s{font-size: 90%;}
.txt_ss{font-size: 80%;}
.txt_l{font-size: 150%;}
.txt_ll{
  font-size: 3rem !important;
  font-weight: bold;
}
/*company*/
.txt_noselect{
  user-select: none;
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer */
  -khtml-user-select: none; /* KHTML browsers (e.g. Konqueror) */
  -webkit-user-select: none; /* Chrome, Safari, and Opera */
  -webkit-touch-callout: none; /* Disable Android and iOS callouts*/
}
.txt_red{
  color: red;
  font-weight: bold;
}

/* align
--------------------------------------------------*/
.ta_c{text-align: center;}
.ta_r{text-align: right;}
.ta_l{text-align: left;}
.img_tac{
  display: block;
  margin: 0 auto;
  text-align: center;
}

/*=========================================
message list
=========================================*/
/*msg_
--------------------------------------------------*/
div[class^="msg_"],
p[class^="msg_"]{
  margin: 20px;
  padding: 10px;
}
div[class^="msg_"]:empty,
p[class^="msg_"]:empty{
  display: none;
}

/*msg_warning*/
.msg_warning{
  display: block;
  text-align: center;
  border: 1px solid #FF8383;
  background: #D82326;
  color: #ffffff;
}
.msg_warning a{color: yellow;}
.msg_warning strong{color:yellow;}

/*isystem-
--------------------------------------------------*/
div[id^="isystem-"],
p[id^="isystem-"]{
  display: block;
  text-align: center;
}
div[id^="isystem-"]:empty,
p[id^="isystem-"]:empty{
  display: none;
}
/*isystem-regist_word…登録系メッセージ*/
#isystem-regist_word{
  margin: 2rem;
  padding: 1rem;
}


/*=========================================
input
=========================================*/
input[type="submit"], button{cursor: pointer;}
select, input, textarea, button {
  font-family: inherit;
  vertical-align:middle;
}
/* type="image"
--------------------------------------------------*/
input[type="image"]{
  display: block;
  margin: 2rem auto;
  background-color: transparent !important;
}

/* submit
--------------------------------------------------*/
/*pay/select*/        div[class="payments_block"] input[type="submit"] ,
/*bankagent*/        input[name="submit[btn][pay_bankagent][add]"] ,
/*bitcash*/            input[name="submit[btn][pay_bitcash][add]"] ,
/*credit*/              input[name="submit[btn][pay_credit][add]"] ,
/*netbank*/          input[name="submit[btn][pay_netbank][add]"] ,
/*point*/               input[name="submit[btn][pay_point][add]"],
/*information*/      input[name="submit[btn][user_detail_info][set]"] ,
/*login*/                form[name="user_login_frm"] input[name="submit[btn][doLogin][get]"] , 
/*view/expect/*/   form[name$="_pay"] input[type="submit"] ,
/*table btn*/          td.tbl_btn a ,
/*premiere*/        .css_btn
{
  border: none;/*reset*/
  display: block;
  margin: 1em auto !important;
  width: 80%;
  padding: 10px;
  font-size: 2rem;
  color: #fff !important;
  text-align: center;
  font-weight: bold;
  border-radius: 10px;
  /*bg*/
  background: #EB4144;
}
/*pay/select*/        div[class="payments_block"] input[type="submit"]:hover ,
/*bankagent*/        input[name="submit[btn][pay_bankagent][add]"]:hover ,
/*bitcash*/             input[name="submit[btn][pay_bitcash][add]"]:hover ,
/*credit*/              input[name="submit[btn][pay_credit][add]"]:hover ,
/*netbank*/          input[name="submit[btn][pay_netbank][add]"]:hover ,
/*point*/               input[name="submit[btn][pay_point][add]"]:hover ,
/*information*/      input[name="submit[btn][user_detail_info][set]"]:hover ,
/*login*/               form[name="user_login_frm"] input[name="submit[btn][doLogin][get]"]:hover ,
/*view/expect/*/   form[name$="_pay"] input[type="submit"]:hover ,
/*table btn*/          td.tbl_btn a:hover ,
/*premiere*/        .css_btn :hover
{
  transform: translateY(2px);
  /*bg*/
  background: #CD1B1E;
}


/*=========================================
pay
=========================================*/
/* select
--------------------------------------------------*/
.payments_block{
  margin: 2rem 0;
  padding: 1rem;
  border: 2px solid rgba(0,0,0,1.00);
}
/* bitcash
--------------------------------------------------*/
a.bitcash_link{
  color: #fff;
  text-decoration: underline;
}
.bitcash_logo{
  width: 20%;
}
/* agree
--------------------------------------------------*/
.agree_submit{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
}
form[name="agree_frm"] input[type="submit"], form[name="agree_frm"] input[type="button"]{
  display: block;
  padding: 5px;
  margin: 5px;
  width: 45%;
  height: 100px;
  font-size: 2rem;
}


/*=========================================
table
=========================================*/
/* tbl_base
--------------------------------------------------*/
.tbl_base input{
  display: block;
  margin: 0 auto;
  width: 80%;
  padding: 5px;
}
.tbl_base{
  width: 100%;
  border-collapse: separate;
  color: #ffffff;
}
.tbl_base th, .tbl_base td{padding: .5em;}
.tbl_base th{
  background-color: #ffa05b;
  white-space: nowrap;
}
.tbl_base td{
  background-color: #eeeeee;
  color: hsla(0,0%,0%,.8);
}

.tbl_base .title{
  background: #c10b0f;
  text-align: center;
  color: #fff;
  font-weight: bold;
}

/*隣接する場合余白*/
.tbl_base + .tbl_base:not(.result_detail) .tbl_base{
  margin: 20px 0;
}


/*=========================================
dl
=========================================*/
dl.dl_base dt{
  padding: 5px;
  margin-bottom: 5px;
  color: #FFFFFF;
  font-weight: bold;
  background: #7f1f1f;
  text-indent: 1rem;
}
dl.dl_base dd{
  padding:  10px;
  margin-bottom: 1rem;
  border-left: 2px solid #7C7C7C;
}

/*=========================================
header
=========================================*/
header{
  padding: 2rem;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  -ms-align-items: center;
  align-items: center;
}
header h1{margin-right: 4rem;}


/* user header
--------------------------------------------------*/
.user_header_info{
width: 100%;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: space-between;
}
.user_header_info .tbl_base {margin-right: 1rem;}
.user_header_info .tbl_base td{text-align: center;}

/* user_nav
--------------------------------------------------*/
nav{
background: #ff9a23;
}
.nav_bg ul{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  /*reset*/
  list-style: none;
  padding: 0;
  margin: 0;
  }
.nav_bg li{
  width: calc(100% / 3);
  text-align: center;
}
.nav_bg li span{
  display: block;
  border-right: 1px solid hsla(0,0%,100%,0.30);
}
.nav_bg li:nth-of-type(3n) span{border: none !important;}
nav li a{
  display: block;
  font-size: 1.8rem;
  color: #fff;
  padding: 1.5rem 0;
}


/*=========================================
footer
=========================================*/
footer{
  color: #8c6417;
  background: #fff;
  /*footer btm fix*/
  margin-top: auto;
}
footer .copy{
  text-align: center;
  padding-bottom: 2rem;
}
.footer_inner{
  background: #ffc658;
  padding-top: .5rem;
  padding-bottom: .5rem;
}
footer ul{
  list-style: none;
  padding-left: 0;
  /*ul liset*/
}
.footer_nav{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
}
.footer_nav a{
  color: #8c6417;
  font-weight: bold;
}
.footer_nav li:after{
  content: "|";
  margin: 1rem;
}
.footer_nav li:last-child:after{display: none;}
.footer_aten{
  padding: 2rem;
  font-size: 1.2rem;
}



/*=========================================
def_index
=========================================*/
.swiper{margin: 0 -20px;}

/*=========================================
user_index
=========================================*/
/* section_result
--------------------------------------------------*/
.section_result{
  margin-top: 4rem;
  margin-bottom: 4rem;
  padding-top: 3rem;
  padding-bottom: 3rem;
  border-top: 5px solid #ffdfb5;
  border-bottom: 5px solid #ffdfb5;
  background: #ffda80;
}
.result_detail{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.result{
  width: 49%;
  margin-top: 3rem;
  padding: 10px;
  border: 2px solid #fff0c3;
  font-size: 2.5rem;
  background: url("../../img/pc/index/result_bg.jpg") no-repeat;
  background-size: cover;
}
.result_info{text-align: right;}
.result_info span{
  color: #c30000;
  text-decoration: underline;
}
.result_money{
  margin: 1rem -10px -10px -10px;
  padding: 10px;
  color: #eddeb4;
  background-image: -moz-linear-gradient( 90deg, rgb(70,0,16) 0%, rgb(169,3,41) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(70,0,16) 0%, rgb(169,3,41) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(70,0,16) 0%, rgb(169,3,41) 100%);
}
.result_money span{
  display: block;
  text-align: center;
  font-size: 5rem;
  font-weight: bold;
}


/* section_voice
--------------------------------------------------*/
.section_voice{
  margin-top: 4rem;
  margin-bottom: 4rem;
}
.voice_wrap{
background: #fff;
margin: 10px 0;
padding: 2rem;
}
.voice_wrap h2{margin: 0 !important;}
.voice_wrap table{margin-top: 2rem;}

/* section_info
--------------------------------------------------*/
.section_info{
  margin-top: 4rem;
  margin-bottom: 4rem;
  padding: 20px;
  background: #fff;
}
.section_info img{width: 100%;}
.info_detail{
  background: #ffcaca;
  padding: 2rem;
  text-align: center;
  font-size: 4rem;
}
.info_detail .title{
  font-size: 3rem;
  font-weight: bold;
}
.info_detail .time{
  color: #838383;
  font-size: 2rem;
}
.info_detail .telmail{
  color: #e63939;
  font-weight: bold;
  margin-top: 1rem;
}
.info_detail .telmail_title{color: #666666 !important;}


/*=========================================
add
=========================================*/
/* about
--------------------------------------------------*/
section.section_about {
  display: flex;
}
.about_wrap {
  display: flex;
  align-items: flex-start;
  width: 100%;
  min-height: 100vh;
}
.about_box {
  padding: 2rem;
  background: rgba(255,255,255,0.8);
  color: #000;
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
}
.about_box .tbl_base{
  width: 80%;
  margin: 0 auto;
}
.bg {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: all 0.5s ease 0s;
  z-index: -1;
}
.show .bg {
  opacity: 1;
}
.bg._01 {
  background-image: url("../../../docroot/img/pc/about/about_bg01.jpg");
}
.bg._02 {
  background-image: url("../../../docroot/img/pc/about/about_bg02.jpg");
}
.bg._03 {
  background-image: url("../../../docroot/img/pc/about/about_bg03.jpg");
}
.bg._04 {
  background-image: url("../../../docroot/img/pc/about/about_bg04.jpg");
}
.bg._05 {
  background-image: url("../../../docroot/img/pc/about/about_bg05.jpg");
}

/* effect_reflection
--------------------------------------------------*/
.effect_reflection {
  position: relative;
  overflow: hidden;
}
.effect_reflection::after {
  content: "";
  display: block;
  width: 30px;
  height: 100%;
  position: absolute;
  top: -180px;
  left: 0;
  background-color: #FFF;
  opacity: 0;
  transform: rotate(45deg);
  animation: reflect 2s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflect 2s ease-in-out infinite;
}
@keyframes reflect {
  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 reflect {
  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; }
}


/* chara
--------------------------------------------------*/
.section_chara{
  padding: 2rem;
  border-color: rgb(255, 255, 255);
  border-style: solid;
  color: #424242;
  margin-bottom: 2rem;
  background-image: -moz-linear-gradient( 90deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(222,222,222) 0%, rgb(255,255,255) 100%);
}
.chara_grade1_bg{
  background-image: -moz-linear-gradient( 90deg, rgb(255,189,59) 0%, rgb(255,223,160) 99%) !important;
  background-image: -webkit-linear-gradient( 90deg, rgb(255,189,59) 0%, rgb(255,223,160) 99%) !important;
  background-image: -ms-linear-gradient( 90deg, rgb(255,189,59) 0%, rgb(255,223,160) 99%) !important;
}
.chara_info{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  padding: 2rem 0;
}
.section_chara pre{
background: rgba(255,255,255,0.70);
padding: 1rem;
}
.chara_info > div{flex-grow: 1; }
.chara_info img{
  margin-right: 2rem;
  height: 300px;
}
.chara_info .tbl_base th{width: 30%;}

.chara_flex{
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
}
.chara_info_mini img{
width: 70%;
display: block;
margin: 0 auto;
}
/*.name{*/
.name{
  font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif;
  font-size: 5rem;
  font-weight: bold;
  line-height: 1;
  margin-right: 2rem;
}
.name span{
margin-left: 1rem;
font-size: 3rem;
}
.chara_info_mini .name{font-size: 3rem !important;}
.chara_info_mini .name span{font-size: 2rem !important;}

/* question(よくある質問)
--------------------------------------------------*/
dl.question {
  color: black;
}
dl.question dt {
  cursor: pointer;
  padding: 5px;
  margin-bottom: 10px;
  font-size: 1.8rem;
  color: #ffffff;
  background: #740000;
}
dl.question dt.active {
  background: #7A4B00;
}
dl.question dd {
  position: relative;
  margin: 10px;
  padding-left: 5rem;
}
dl.question span {
  display: inline-block;
  padding: 3px 7px;
  margin-right: 1rem;
  color: #fff;
  font-size: 2.3rem;
  line-height: 1;
}
dl.question dt span {
  background: #D10003;
}
dl.question dd span {
  position: absolute;
  left: 0;
  background: #01399A;
  font-weight: bold;
}


/*=========================================
section_entryform
=========================================*/
 /* section_entryform
--------------------------------------------------*/
#regist_form{
  padding-top: 7rem;
  padding-bottom: 7rem;
  /*bg*/
  background-image: -moz-linear-gradient( 95deg, rgb(3,0,118) 1%, rgb(14,14,14) 100%);
  background-image: -webkit-linear-gradient( 95deg, rgb(3,0,118) 1%, rgb(14,14,14) 100%);
  background-image: -ms-linear-gradient( 95deg, rgb(3,0,118) 1%, rgb(14,14,14) 100%);
}
.section_entryform{
  text-align: center;
  color: #000;
}
.section_entryform input[type="text"]{
  width: 100%;
  padding: 20px;
  font-size: 3rem;
  text-align: center;
  margin-top: 4rem;
}

.section_entryform input[type="image"], .poyopoyo {
  animation: poyopoyo 2s ease-out infinite;
  opacity: 1;
}
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}


/*=========================================
lp
=========================================*/
.section_sendmail .tbl_base th{width: 20%;}

/* domein
--------------------------------------------------*/
.domein{
  padding: 2rem;
  margin-top: 2rem;
  background: #D3D3D3;
  color: #000;
}
.domein_wrap{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-around;
}

/* fixed_banner
--------------------------------------------------*/
.fixed_banner {
  position: fixed;
  z-index: 99999;
  top: 30px;
  right: 30px;
  opacity: 0;
}
.fixed_banner.isActive {
  opacity: 1;
  transition: all 0.65s;
}

.fixed_banner_pc {width: 149px;}
.fixed_banner_pc.isActive {
  opacity: 1;
  transition: all 0.65s;
}
.floating-banner:hover {opacity: .8;}
@media screen and (max-width: 480px) {
  .fixed_banner_pc {display: none;}
}

/* table(break640)
-------------------------------------------------*/
@media screen and (max-width: 640px) {
  .tbl_base td, .tbl_base th{
    display: list-item;
    list-style: none;
    border-top: none !important;
  }
}

/* lp01
--------------------------------------------------*/
.nmt-3r{margin-top: -3rem}
.bg_white{background: #fff;}

.lp01_img01{
  background: url("../../img/pc/lp/lp01/lp01_img01_bg.jpg") no-repeat center center;
  -webkit-background-size: cover;
  background-size: cover;
}
.lp01_img02{
  background-image: -moz-linear-gradient( 95deg, rgb(14,14,14) 0%, rgb(3,0,118) 99%);
  background-image: -webkit-linear-gradient( 95deg, rgb(14,14,14) 0%, rgb(3,0,118) 99%);
  background-image: -ms-linear-gradient( 95deg, rgb(14,14,14) 0%, rgb(3,0,118) 99%);
}
.lp01_img03{
  background: url("../../img/pc/lp/lp01/lp01_img03_bg.jpg") no-repeat center center;
  -webkit-background-size: cover;
  background-size: cover;
  text-align: center;
}
.lp01_img04{
  padding-top: 2rem;
  padding-bottom: 2rem;
}
