/* font参考：https://pecopla.net/web-column/fontsize-css */
html {
  font-size: 62.5%;
  overflow: auto;
}
body {
  overflow-x:hidden;
  font-size:1.6rem;/*16px*/
  line-height:1.8;
/*  font-family: メイリオ, Meiryo, 'Hiragino Kaku Gothic Pro',
    'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Arial, Verdana, sans-serif;*/
  font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  text-align: justify;
  text-justify: inter-ideograph;
  font-feature-settings: "palt" 1;
}

input,select,textarea {
 /* font-family: メイリオ, Meiryo, 'Hiragino Kaku Gothic Pro',
 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Arial, Verdana, sans-serif;*/
  font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', 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:#000;}
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; */
}

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
}

/*--------------------------------------------------------
定数（基本的に、全サイト共通に使えるもの）
--------------------------------------------------------*/
.c {text-align:center!important;}
.cm {
  margin-left: auto;
  margin-right: auto;
}
.r {text-align:right!important;}
.l {text-align:left!important;}

.inline-block {display:inline-block;}
.block {display:block;}
.vertical-top {vertical-align: top;}
.pointer {cursor: pointer;}



.padding300p {padding-top:30%;}
.padding250p {padding-top:25%;}
.padding200p {padding-top:20%;}
.padding150p {padding-top:15%;}
.padding100p {padding-top:10%;}
.padding90p {padding-top:9%;}
.padding80p {padding-top:8%;}
.padding70p {padding-top:7%;}
.padding60p {padding-top:6%;}
.padding50p {padding-top:5%;}
.padding40p {padding-top:4%;}
.padding30p {padding-top:3%;}
.padding25p {padding-top:2.5%;}
.padding20p {padding-top:2%;}
.padding10p {padding-top:1%;}
.padding5p {padding-top:0.5%;}

.padding5 {padding-top:5px;}
.padding10 {padding-top:10px;}
.padding20 {padding-top:20px;}
.padding30 {padding-top:30px;}
.padding40 {padding-top:40px;}
.padding50 {padding-top:50px;}
.padding60 {padding-top:60px;}
.padding70 {padding-top:70px;}
.padding80 {padding-top:80px;}
.padding90 {padding-top:90px;}
.padding100 {padding-top:100px;}

.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;}

.z0{ z-index: 0; }
.z1{ z-index: 0; }
.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%;}

/*--------------------------------------------------------
サイト毎に変化のある定数
--------------------------------------------------------*/
.fullscreen {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.contents {
  width: 900px;
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
}
.contents1800 {
  width: 100%;
  max-width: 1800px;
  margin-right: auto;
  margin-left: auto;
}
.contents_inner {
  width: 90%;
  padding:0 5%;
}
.contents_privacyHead {
  width: 660px;
  border-radius: 50px;
  border: 2px solid #2D1015;
  padding: 10px 20px;
  font-size: 2rem;
  text-align: center;
}
.contents_privacy {
  width: 800px;
  padding: 0 20px;
  font-size: 2.4rem;
}


.img_center {
  margin-left:-450px;
}

.back_white {background-color:#fff;}
.back_black {background-color:#000;}
.back_clear {background-color: transparent;}

.white {color:#FFF;}
.black {color:#000;}
.red {color:#FF0000;}

/*--------------------------------------------------------
ヘッダー
--------------------------------------------------------*/
header {
  width:100%;
  margin:0 auto;
  line-height: 0; /* 画像の上下に隙間が空いてしまう対策 */

  position:fixed;
  z-index:100;
  /* top:-1px; */
}
/*--------------------------------------------------------
フッター
--------------------------------------------------------*/
footer {
  position:relative;
  z-index:2;
  text-align:center;
  /* background-color: #FFA936; */
  color: #000;
}
.copyright{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 3%;
}
.copyright,
.copyright a{
  font-size: 2.4rem;
  color: #fff;
}
.pp{
  font-size: 3.4rem!important;
}
.copyright a:hover{
  text-decoration: underline;
}
.alignL{
    padding-right: 1.5%;
    text-align: left;
}
.alignSelf_end{
  align-self: flex-end;
}
.bg-clr{
  background-color: #231815;
}
/*--------------------------------------------------------
↓↓↓ 各種レイアウト ↓↓↓
--------------------------------------------------------*/
/* --背景設定-- */
.bg_privacy{
  background: url(../img/djd_bg.png);
  background-repeat: repeat-y;
  max-width: 1800px;
  margin: 0 auto;
}
/* --画像位置設定-- */
.djd{
  top: 0;
  left: 0;
}
.djd._hosi{
  top: 17%;
}
.djd._01_1{
  top: 0;
  left: 0;
}
.djd._01_2{
  top: -7%;
}
.djd._btn{
  top: 21%;
}
.djd._btn_1{
  top: 55%;
  left: -12%
}
.djd._btn_2{
  top: unset;
  bottom: 0;
}
.djd._02_1{
  top: 3%;
  left: 35%;
}
.djd._02_1b{
  top: 28%;
  left: 35%;
}
.djd._03_1{
  top: 47%;
  left: -4%;
}
.djd._04_1{
  top: 10.5%;
}
/* .djd._05_1{
  top: 10%;
  left: 10%;
} */
.djd._06_1{
  top: 44%;
  left: 12.5%;
}
.djd._07_1{
  top: 53%;
  left: 30%;
}
.djd._08_1{
  top: 49%;
  left: 1%;
}

/* --画像を光らせる-- */
.reflection-img{
  overflow:hidden;
  top: 40%;
  left: 0%;
}
.reflection.go {
  height:100%;
  width:60px;
  position:absolute;
  top:-180px;
  left:0;
  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; }
  20% {-webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  21% {}
  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; }
}

/* --プラポリ-- */
.contents_privacy p{
  padding-bottom: 3rem;
}
.privacy_subtitle{
  font-size: 2.7rem;
}
/* --animete.css制御-- */
.animate__animated.animate__rubberBand {
  --animate-duration: 1.5s;

}

/*--------------------------------------------------------
↑↑↑ 各種レイアウト ↑↑↑
--------------------------------------------------------*/
/*--------------------------------------------------------
↓↓↓ フォーム部分 ↓↓↓
--------------------------------------------------------*/
form {
  color:#000;
  font-size: 1.5rem;
}
.err_msg { color:red; }
.form { width:90%; }
.form_item {
  margin-top:1.5rem;
  margin-bottom:0.3rem;
  line-height:1.8;
}
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea{
  width:96%;
  padding: 1% 2% 1.0% 2%;
  display: block;
  background-color: #FFF;
  border:1px solid #333;
  /* border-radius: 10px; */
}
input::-webkit-input-placeholder { padding-top: 0.1rem; } /*iphone対応*/
input:disabled { opacity: 0.8; }
select { width:100%; }
textarea { height:10rem; }


/********
チェックボックス
********/
.checkbox-input{
  display: none;
}
.checkbox-parts{
  /* padding-top:30px; */
  padding-left: 40px;
  position:relative;
  /* margin-right: 20px; */
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 2rem;
}
.checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 2px;
  left: 0;
  width: 25px;
  height: 25px;
  border: 2px solid #333;
  border-radius: 4px;
}
.checkbox-input:checked + .checkbox-parts{
  color: red;
}
.checkbox-input:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -9px;
  left: 7px;
  width: 14px;
  height: 28px;
  transform: rotate(40deg);
  border-bottom: 5px solid red;
  border-right: 5px solid red;
}

/*--------------------------------------------------------
↑↑↑ フォーム部分 ↑↑↑
--------------------------------------------------------*/
/*--------------------------------------------------------
サンキュー用レイアウト
--------------------------------------------------------*/

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