@charset "UTF-8";
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Copyright (c) Best Bridge LLC. All Rights Reserved.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Original source code and design structure.
Unauthorized reproduction prohibited.

閲覧・学習目的での参照は問題ありませんが、
本コードおよびデザイン構造の全部または一部を、
無断で複製・流用・再配布することを禁止します。

本コードは制作履歴・公開履歴・電子署名等により
権利保全を行っています。

本コード特有の
設計思想／構造設計／命名規則／記述順／レイアウト構成
には識別性があります。

一般的CSSとは異なる独自設計のため、
類似構造や類似記述は、
コード圧縮／難読化／改行変更／変数化後でも、
構造的特徴および設計パターンから
識別・照合可能です。

無断流用・模倣・構造複製が確認された場合、
利用停止要請・権利侵害通知・法的措置を含む
対応を行う場合があります。
*/

/*==============================================================
#page_entry
==============================================================*/
#page_entry{
z-index:4000;
/*--*/
position:relative;
/*--*/
display:block;
width:100%;
height:auto;
margin:0;
border:0;
padding:90px max(5%,calc((100% - 700px) / 2));
background-image:linear-gradient(to bottom,#F4F4F4,#FFF);
background-size:100% 300px;
background-repeat:no-repeat;
background-color:#FFF;
}

@media screen and (max-width:700px){
#page_entry{
padding:60px max(5%,calc((100% - 700px) / 2));
}
}

/*==============================================================
#page_entry h2
==============================================================*/
#page_entry h2{
position:relative;
/*--*/
display:block;
width:100%;
height:auto;
margin-bottom:30px;
border:0;
padding:0;
/*--*/
text-align:center;
line-height:1.6;
font-size:1.8rem;
font-weight:bold;
color:#666;
}

@media screen and (max-width:700px){
#page_entry h2{
font-size:1.6rem;
}
}

/*==============================================================
#page_entry p
==============================================================*/
#page_entry p{
position:relative;
/*--*/
display:block;
width:100%;
height:auto;
margin-bottom:30px;
border:0;
padding:0;
/*--*/
text-align:left;
line-height:1.6;
font-size:1rem;
font-weight:normal;
color:#666;
}

#page_entry p.kiroku{
margin-bottom:0;
text-align:center;
font-size:0.8rem;
font-weight:bold;
color:#F90;
}

/*==============================================================
#page_entry ul
==============================================================*/
#page_entry ul{
position:relative;
/*--*/
display:flex;
width:100%;
height:auto;
margin-bottom:30px;
border:solid 1px #CCC;
padding:0;
/*--*/
flex-direction:row;/*方向*/
flex-wrap:wrap;/*改行*/
justify-content:space-between;/*横揃え*/
align-items:stretch;/*縦揃え*/
}

#page_entry ul>li::before{
content:none;
}

/*--------------------------------------------
#page_entry ul>li:nth-of-type(odd)
--------------------------------------------*/
#page_entry ul>li:nth-of-type(odd){
position:relative;
/*--*/
display:block;
flex-basis:30%;
height:auto;
margin:0;
border:solid 1px #CCC;
padding:20px 10px;
background-color:#EFEFEF;
/*--*/
text-align:left;
line-height:1.6;
font-size:1rem;
font-weight:bold;
color:#666;
}

@media screen and (max-width:700px){
#page_entry ul>li:nth-of-type(odd){
flex-basis:100%;
margin-bottom:0;
border-bottom:0;
}
}

/*--------------------------------------------
#page_entry ul>li:nth-of-type(even)
--------------------------------------------*/
#page_entry ul>li:nth-of-type(even){
position:relative;
/*--*/
display:block;
flex-basis:70%;
height:auto;
margin:0;
border:solid 1px #CCC;
padding:20px 10px;
background-color:#FFF;
/*--*/
text-align:left;
line-height:1.6;
font-size:1rem;
font-weight:normal;
color:#666;
}

@media screen and (max-width:700px){
#page_entry ul>li:nth-of-type(even){
flex-basis:100%;
border-top:0;
}
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"]{
width:100%;
min-height:40px;
margin-bottom:10px;
border:solid 1px #CCC;
padding:5px;
border-radius:3px;
background-color:#FFF;
/*--*/
font-size:1rem;
color:#333;
}

textarea{
width:100%;
border:solid 1px #CCC;
padding:10px;
/*--*/
font-size:1rem;
color:#333;
resize:vertical; /* 縦にだけ伸ばせるようにする */
}

/*==生年月日==*/
.input-date-wrap{
display:flex;
align-items:center;
flex-wrap:wrap;
}

.input-short{
width:60px !important;
text-align:center;
}

/*==============================================================
#page_entry div.button
==============================================================*/
#page_entry div.button{
position:relative;
/*--*/
display:flex;
width:100%;
height:auto;
margin:0;
border:0;
padding:0;
/*--*/
flex-direction:row;/*方向*/
flex-wrap:wrap;/*改行*/
justify-content:space-between;/*横揃え*/
align-items:stretch;/*縦揃え*/
}

#page_entry div.button>div{
position:relative;
/*--*/
display:block;
flex-basis:49%;
height:auto;
margin-bottom:20px;
border:0;
padding:0;
}

@media screen and (max-width:700px){
#page_entry div.button>div{
flex-basis:100%;
}
}

#page_entry div.button>div>input{
position:relative;
/*--*/
display:block;
width:100%;
height:auto;
margin:0;
border:0;
border-radius:10px;
padding:15px 10px;
background-color:#F90;
/*--*/
text-align:center;
line-height:1.6;
font-size:1rem;
font-weight:bold;
color:#FFF;
transition:opacity .3s;
}

@media (hover:hover) and (pointer:fine){
#page_entry div.button>div>input:hover{
opacity:.7;
}
}
