@charset "UTF-8";
/* CSS Document */
/*-------------------------------------------------------------------------------------
PC用レイアウト（768px以上スクリーン）
----------------------------------------------------------------------------------------*/
/*--------------------------------------------------
共通設定(PC)
-----------------------------------------------------*/
/*body全体の初期スタイル調整*/
body {
  font-size: 62.5%; /*emの計算をしやすくするための定番設定*/
  font-family: 'Noto Sans JP', "メイリオ", Meiryo, Arial, Verdana, sans-serif;
  font-weight: normal;
  color: #000;
}
html {
  scroll-behavior: smooth;
}
/*リンク文字の設定*/
a {
  text-decoration: underline;
}
a:link, a:visited {
  color: #39f;
}
a:hover, a:active {
  color: #f60;
}
/*ブラウザのCSSをリセット*/
p {
  margin: 0 !important;
  padding: 0 !important;
}
/*セクションエリアの共通設定*/
section {
  clear: both;
  overflow: auto;
}
/*--------------------------------------------------
見出しタグ設定（PC）
-----------------------------------------------------*/
h2 {
  margin: 0.5em 0em;
  font-size: 2em;
  font-weight: bold;
}
/*h3 {
  margin: 0.5em 0em;
  padding: 0.3em 0.6em;
  font-size: 1.6em;
  font-weight: bold;
  border-left: 8px solid #10559A;
  border-bottom: 1px dotted #10559A;
}*/
h4 {
  margin: 0.5em 0em;
  padding: 0.3em 0.6em;
  font-size: 1.4em;
  border: 1px solid #ccc;
  font-weight: bold;
}
h5 {
  margin: 0.5em 0em;
  padding: 0.1em;
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 1px dotted #ccc;
}
/*--------------------------------------------------
全体レイアウト／背景設定（PC）
-----------------------------------------------------*/
/*全体エリア（全体背景を設定するにはここ）*/
.main {
  background: url(../images/whitediamond.png) #fff repeat;
}
/*記事(ボディ)エリア*/
.article {
  background-color: #fff;
  font-size: 2.4em; /*=16px*/
}
/*記事(ボディ)エリアの行間*/
.article p {
  line-height: 1.8;
}
.article {
  width: 100%;
}
/*カラム全体の幅を変更する*/
.top_image_in {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
}
.section_inr {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  padding: 50px 100px 50px;
  text-align: center;
}
.section_inr2 {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  background-color: #fff;
  text-align: center;
  border-right: 20px solid #ffabb2;
  border-left: 20px solid #ffabb2;
  border-bottom: 20px solid #ffabb2;
}
.section_inr3 {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  padding: 50px 0;
  background: #fff;
}
.section_inr4 {
  width: 100%;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  padding: 3%;
  background-color: #fff;
  text-align: center;
  border: 1px solid #292929;
}
.section_inr5 {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  padding: 50px 100px 50px;
  text-align: center;
  background: #fff;
}
.section_inr_cta {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  padding: 50px 10px 50px;
  text-align: center;
}
/*--------------------------------------------------
上部固定ヘッダー設定
-----------------------------------------------------*/
/*上部固定ヘッダー全体*/
.header {
  /*  position: sticky;*/
  /* position: -webkit-sticky;*/
  top: 0;
  z-index: 5000;
  background-color: #f37b83;
  border-bottom: 1px solid #ccc;
  overflow: auto;
}
/*ヘッダー内部をカラム幅にする*/
.header_inr {
  max-width: 950px;
  margin: 0 auto;
  overflow: hidden;
}
/*ヘッダーのロゴ*/
.header_logo {
  width: 20%;
  float: left;
  margin: 0em;
}
/*ヘッダーの問い合わせボタン*/
.header_mail {
  width: 25%;
  float: right;
  margin: 0.8em 0em 0em;
}
/*ヘッダーの電話ボタン*/
.header_tel {
  width: 30%;
  float: right;
  margin: 0.8em 0em 0em;
}
/*ヘッダー内の画像が常に幅100%になるように*/
.header_logo img, .header_mail img, .header_tel img {
  width: 100%;
}
/*--------------------------------------------------
ファーストビュー設定
-----------------------------------------------------*/
.top_image {
  background-image: url("../images/top_image_back.png");
  background-repeat: no-repeat;
  background-position: top center;
  height: auto;
}
.top_image_in img {
  width: 100%;
}
/*--------------------------------------------------
sectionの設定
-----------------------------------------------------*/
.section_01 {
  /*  background: url(../images/grey.png) #fff repeat;*/
}
.section_02 {
  background: url(../images/footer_lodyas.png) #000 repeat;
  padding-bottom: 2%;
}
.section_03 {
  background: url("../images/grey.png") #fff repeat;
  padding: 2% 0;
}
.section_04 {
  background: url("../images/sec04-bg.png") #fff no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.section_04_ {
  background: url("../images/ps_neutral.png") #fff repeat;
}
.section_05 {
  background: url("../images/bg_about.jpg") #fff no-repeat;
  background-size: cover;
}
.section_06 {
  background: url("../images/gplaypattern.png") #fff repeat;
  padding: 2% 0;
  text-align: left;
}
.section_07 {
  background: url("../images/bg_silver.jpg") #000 no-repeat;
  background-size: cover;
}
.section_08 {
  background: url("../images/stripes-light.png") #fff repeat;
  padding: 0 0 2% 0;
}
/*--------------------------------------------------
チェックリスト設定
-----------------------------------------------------*/
ul.checklist {
  border: 1px solid #ccc;
  list-style: none;
  padding: 1em;
}
ul.checklist li {
  background-image: url("../images/icon-check03-red.png");
  background-repeat: no-repeat;
  background-size: 3.5%;
  padding-left: 1.8em;
  margin-bottom: 0.8em;
}
ul.checklist li:last-child {
  margin-bottom: 0em;
}
/*--------------------------------------------------
テーブル設定
-----------------------------------------------------*/
table {
  width: 100%;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  margin: 1em 0em;
}
th, td {
  padding: 0.5em;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
th {
  background-color: #f0f0f0;
  font-weight: bold;
  text-align: center;
}
td {
  background-color: #fff;
  text-align: left;
}
/*スマホでは行が列になるテーブルタグ*/
.table_style_01 {
  text-align: left;
  vertical-align: middle;
}
/*--------------------------------------------------
フォーム設定
-----------------------------------------------------*/
.mailform {
  background-color: #fff;
  margin-bottom: 1em;
  padding: 1em 0em 1.5em;
  box-shadow: 0px 0px 1px #000;
}
.input {
  padding: 0 2em;
}
.input_style {
  background-color: #FFFBF0;
  width: 100%;
  height: 60px;
  margin-bottom: 0.5em;
  text-align: center;
  font-size: 1.4em;
}
input[type="image"] {
  width: 90%;
}
.caution {
  text-align: center;
  font-size: 0.8em;
  color: #F00;
}
/*--------------------------------------------------
よくある質問
-----------------------------------------------------*/
.box_qa {
  background-color: #efefef;
  padding: 1em;
}
.box_qa_q {
  background-color: #fff;
  padding: 1em 2em 1em 3em;
  border-bottom: 1px solid #ccc;
  font-size: 1.2em;
  font-weight: bold;
  color: #D10003;
}
.box_qa_a {
  background-color: #fff;
  padding: 1em 2em 1em 3em;
}
.box_qa_q p, .box_qa_a p {
  text-indent: -2em;
}
/*--------------------------------------------------
CTAエリア
-----------------------------------------------------*/
.area_cta {
  background-color: #105FA3;
  padding: 1em 3em;
}
.area_cta_inr {
  background-color: #fff;
  padding: 1em 2em;
  overflow: auto;
}
.area_cta_inr_left {
  float: left;
  width: 48%;
}
.area_cta_inr_right {
  float: right;
  width: 48%;
}
/*--------------------------------------------------
フッター部分
-----------------------------------------------------*/
.footer {
  background-color: #000;
  padding: 2em 0em;
  text-align: center;
  font-size: 1.4em;
  color: #fff;
}
.footer a {
  color: #fff;
}
/*--------------------------------------------------
追加CSS
-----------------------------------------------------*/
/* 点滅 */
.blinking {
  -webkit-animation: blink .8s ease-in-out infinite alternate;
  -moz-animation: blink .8s ease-in-out infinite alternate;
  animation: blink .8s ease-in-out infinite alternate;
}
@-webkit-keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
img.scroll {
  margin: auto;
  margin-bottom: 3em;
}
img.present {
  margin: auto;
  width: 100%;
}
img.support {
  margin: auto;
  padding: 2%;
  width: 100%;
}
img.book {
  margin: auto;
  width: 100%;
  padding: 2%
}
img.sec08 {
  margin: auto;
  width: 80%;
  padding: 5%
}
img.text {
  margin: auto;
  width: 55%;
}
img.prf {
  margin: auto;
  padding-bottom: 1em;
}
img.prf2 {
  margin: auto;
  padding-bottom: 1em;
  width: 50%;
}
img.tri {
  margin-top: -15px;
  width: 36px;
}
img.media {
  margin: auto;
  padding: 1em;
  margin-bottom: 1em;
}
img.soredeha {
  margin: auto;
  margin: 20px;
  width: 65%;
}
img.ya {
  margin: auto;
  margin: 20px;
  width: 10%;
}
@media only screen and (max-width : 768px) {
  img.scroll {
    margin: auto;
    margin-bottom: 1em;
    width: 25px;
  }
  img.sec04 {
    margin: auto;
    width: 100%;
  }
  img.text {
    margin: auto;
    width: 90%;
  }
  img.sec08 {
    margin: auto;
    width: 100%;
  }
  img.sec09 {
    margin: auto;
    width: 100%;
  }
  img.prf {
    margin: auto;
    padding: 1em;
    width: 100%;
  }
  img.tri {
    margin: auto;
    width: 36px;
    margin-top: -2px;
  }
  img.prf2 {
    width: 80%;
  }
  img.vol1 {
    width: 100%;
  }
  img.sub-top {
    width: 5px;
  }
  img.media {
    margin: auto;
    padding: 1em;
    width: 65%;
  }
  .t-title img {
    width: 100%;
  }
  img.soredeha {
    width: 60%;
    margin: 3%;
  }
  img.ya {
    margin: 3%;
    width: 15%;
  }
  img.name {
    margin: 3%;
    width: 40%;
  }
}
.bg_gray {
  background-color: #fff;
  margin: 0 auto;
  text-align: center;
  padding: 1% 0;
}
.bg_gray img {
  max-width: 1000px;
}
.bd03 {
  background: repeating-linear-gradient(120deg, #757575 0, #757575 10px, #fff 10px, #fff 20px);
  height: 0.5em;
}
.movie_in {
  width: 1000px;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
  text-align: center;
  padding: 2% 0;
}
.gradient {
  border: 6px solid #ed6e9f;
  border-image: linear-gradient(to right, #ed6e9f 0%, #ec8b6b 100%);
  border-image-slice: 1;
}
@keyframes shiny {
  0% {
    transform: scale(0) rotate(25deg);
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(25deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(25deg);
    opacity: 0;
  }
}
.shiny-btn {
  position: relative;
  display: block;
  height: 142px;
  line-height: 111px;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  overflow: hidden;
	margin:0 100px 20px;
}
.shiny-btn::after {
  content: '';
  position: absolute;
  top: -100px;
  left: -100px;
  width: 50px;
  height: 50px;
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 1) 100%, rgba(255, 255, 255, 0) 0%);
  /* アニメーション */
  animation-name: shiny;
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
.shiny-btn2 {
  position: relative;
  display: block;
  width: 100%;
  height: 160px;
  line-height: 160px;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  overflow: hidden;
	margin-bottom: 10px;
}
.shiny-btn2::after {
  content: '';
  position: absolute;
  top: -100px;
  left: -100px;
  width: 50px;
  height: 50px;
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 1) 100%, rgba(255, 255, 255, 0) 0%);
  /* アニメーション */
  animation-name: shiny;
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
.sec-top {
  width: 100%;
  height: 10px;
  background: url("../images/bg-gold.jpg") repeat-y;
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
}
.sec-title {
  background: url("../images/bg01.png") repeat-y top;
}
.sec-title2 {
  background: url("../images/bg02.png") repeat-y top;
}
.sec-title, .sec-title2 {
  margin: auto;
  width: 100%;
  padding: 30px 3% 1px 3%;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
  color: #FFF;
}
div.ya {
  background: url("../images/sec-ya.png") no-repeat top;
}
div.ya2 {
  background: url("../images/sec-ya2.png") no-repeat top;
}
div.ya, div.ya2 {
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
}
div.ya img, div.ya2 img {
  width: 100%;
  height: auto;
}
h2.t-title {
  font-family: 'Times New Roman', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W6', 'HiraMinProN-W6', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;
  font-size: 3em;
  line-height: 1.0;
  font-weight: bold;
}
h2.t-title2 {
  font-family: 'Times New Roman', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W6', 'HiraMinProN-W6', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;
  font-size: 1.5em;
  line-height: 1.0;
  font-weight: bold;
  font-feature-settings: "palt";
}
.bg_white {
  background: #fff;
}
.clearfix {
  zoom: 1;
}
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
#profile {
  margin: auto;
  max-width: 1000px;
  padding: 50px 60px 45px 60px;
  background: #fff;
  line-height: 1.8;
  font-size: 0.7em;
  font-weight: 400;
}
dl.profile1 {
  padding-bottom: 20px;
  border-bottom: 1px dotted #dd1d63;
  margin-bottom: 40px;
}
dl.profile1 dt, dl.profile2 dt {
  float: left;
  width: 30%;
}
dl.profile1 dt img, dl.profile2 dt img {
  width: 100%;
  border-radius: 50%;
}
dl.profile2 dt.pro img {
  border-radius: 0px;
}
dl.profile1 dd, dl.profile2 dd {
  float: left;
  width: 65%;
  padding: 0 0 0 5%;
}
@media only screen and (max-width : 768px) {
  .movie_in {
    width: 100%;
    margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
    text-align: center;
    padding: 2% 0;
  }
  .shiny-btn {
    position: relative;
    display: block;
    height: 4.7em;
    line-height: 39px;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    overflow: hidden;
    margin: 0 1% 3%;
  }
	  .shiny-btn2 {
    position: relative;
    display: block;
    height: 68px;
    line-height: 39px;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    overflow: hidden;
    margin: 0;
		  margin-bottom: 3%;
  }
  .section_inr3 {
    width: 100%;
    margin: 0 auto;
    padding: 3% 1%;
  }
  .section_inr2 {
    width: 100%;
    margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
    background-color: #fff;
    text-align: center;
    border-right: 10px solid #ffabb2;
    border-left: 10px solid #ffabb2;
    border-bottom: 10px solid #ffabb2;
  }
  .section_inr_cta {
    width: 100%;
    margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
    padding: 8% 1% 8%;;
    text-align: center;
  }
  .section_inr5 {
    width: 100%;
    margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
    padding: 3% 1%;
    text-align: center;
    background: #fff;
  }
  #profile {
    margin: auto;
    max-width: 1000px;
    padding: 0;
    background: #fff;
    line-height: 1.8;
    font-size: 0.9em;
    font-weight: 400;
  }
  dl.profile1 {
    padding-bottom: 20px;
    border-bottom: 1px dotted #dd1d63;
    margin-bottom: none;
  }
  dl.profile1 dt, dl.profile2 dt {
    float: none;
    width: 100%;
    text-align: center;
  }
  dl.profile1 dt img, dl.profile2 dt img {
    width: 50%;
    border-radius: 50%;
    margin-top: 17px;
  }
  dl.profile2 dt.pro img {
    border-radius: 0px;
  }
  dl.profile1 dd, dl.profile2 dd {
    float: none;
    width: 100%;
    padding: 5%;
  }
  dd {
    margin: 0 auto;
  }
  h2.t-title {
    font-family: 'Times New Roman', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W6', 'HiraMinProN-W6', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;
    font-size: 2.2em;
    line-height: 1.0;
    font-weight: bold;
    width: 100%;
  }
  .sec-title, .sec-title2 {
    margin: auto;
    width: 100%;
    padding: 10px 3% 1px 3%;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    color: #FFF;
  }
}
.note_wrap {
  background: #fff;
  padding: 1em 2em;
  margin: 30px auto;
  text-align: left;
}
.note {
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 97%, #ddd 97%, #ddd 100%);
  background-size: 100% 2em;
  line-height: 2;
}
.note p {
  margin-bottom: 0 !important;
  line-height: 2.0 !important;
}
.box_contents {
  padding: 0 50px;
}
.box_contents p {
  padding-bottom: 8px !important;
  line-height: 1.5 !important;
}
@media only screen and (max-width : 768px) {
  .box_contents {
    padding: 0 3%;
  }
  .box_contents p {
    padding-bottom: 8px !important;
    line-height: 1.3 !important;
    font-size: 0.9em !important;
  }
}
.ContentOver-box {
  z-index: 99;
  margin: 0 -20px;
}