/*共通CSS*/
*{
 box-sizing: border-box;
}
@font-face {
 font-family: 'MyFont';
 src: url('../font/MochiyPopOne-Regular.eot');
 src: url('../font/MochiyPopOne-Regular.eot?#iefix') format('embedded-opentype'),
  url('../font/MochiyPopOne-Regular.woff') format('woff'),
  url('../font/MochiyPopOne-Regular.ttf') format('truetype'),
  url('../font/MochiyPopOne-Regular.otf') format('opentype');
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}
/*共通CSS*/
body{
 position: relative;
 font-family: 'MyFont';
 text-align: center;
 margin: 0;
 padding: 0;
 height: 100%;
 min-height: 100vh; 
 display: flex;
 flex-direction: column;
 overflow: hidden;
 overflow-y: scroll;
 flex: 1;
 background-color: whitesmoke;
}
.body_box{
 width: 100%;
 margin: 0 auto;
 padding: 0;
 overflow-x: hidden;
}
ul{
 padding: 0;
}
li{
 list-style: none;
}
input,
select,
textarea,
input[type="date"],
input[type="time"]{
 width: 90%;
 -webkit-font-size: 115%;
 -moz-font-size: 115%;
 -ms-font-size: 115%;
 -o-font-size: 115%;
 font-size: 115%;
 border-radius: 15px;
 font-family: 'Myfont';
 -webkit-outline: none;
 -moz-outline: none;
 -ms-outline: none;
 -o-outline: none;
 outline: none;
 -webkit-border: none;
 -moz-border: none;
 -ms-border: none;
 -o-border: none;
 border: none;
 padding: 20px 10px;
 background-color: whitesmoke;
}
select{
 padding: 8px 10px;
 font-size: 135%;
}
input:disabled{
 background-color: silver;
 color: gray;
}
input:focus,
select:focus,
textarea:focus{
 background-color: snow;
 outline: none;
}
.button{
 width: 75%;
 font-size: 138%;
 background-color: black;
 color: white;
 margin: 15px auto;
 padding: 18px 15px;
 cursor: pointer;
}
.page_field{
 padding: 0;
 margin: 0 auto;
 width: 100%;
 height: 100%;
 display: flex;
 box-sizing: border-box; 
 flex-direction: column;
 overflow-x: hidden;
}
/*モーダルウィンドウ*/
.modal{
 display: none;
 position: fixed;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
 overflow: auto;
 background-color: rgba(0,0,0,0.4);
 z-index: 999999;
}
/*モーダル - 閉じる*/
.close{
 position: fixed;
 right: 10px;
 top: 10px;
 font-size: 280%;
 z-index: 999999;
}
/*スクロール禁止*/
.no-scroll{
 overflow: hidden;
}
/*ポップアップ*/
.popup{
 position: fixed;
 top: 50%;
 left: 50%;
 width: 80%;
 transform: translate(-50%, -30%);
 background-color: whitesmoke;
 padding: 20px;
 border-radius: 10px;
 box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
 font-size: 135%;
 z-index: 999999999;
}
/*パンくずリスト*/
.PanList{
 text-align: left;
 margin: 20px auto;
 margin-top: 20px;
}
.PanList ul{
 padding: 0;
}
.PanList li{
 position: relative;
 display: inline-block;
 margin: 0 10px;
}
.PanList li::after{
 position: absolute;
 padding: 0 10px;
 content: '>';
}
/*エラー*/
.err{
 color: tomato;
 font-size: 80%;
}
/*必須*/
.required{
 background-color: tomato;
 border-radius: 8px;
 padding: 3px 12px;
 color: white;
}
/*問い合わせ*/
.contact_field{
 margin: 10px auto;
}
.contact_tel,
.contact_mobile{
 position: relative;
 padding-left: 30px;
 margin: 20px auto;
}
.contact_tel{
 font-size: 32px; 
}
.contact_mobile{
 font-size: 26px; 
}
.contact_tel::before,
.contact_mobile::before{
 position: absolute;
 content: '';
 width: 35px;
 height: 35px;
 left: -10px;
}
.contact_tel::before{
 content: url('../img/call-icon.svg');
}
.contact_mobile::before{
 content: url('../img/phone-icon.svg');
}
.contact_tel a{
 color: tomato;
}
.contact_mobile a{
 color: royalblue;
}
.contact_tel a,
.contact_mobile a{
 text-decoration: none;
 border: none;
}
.Contact_Open{
 width: 380px;
 background-color: royalblue;
}
/*↓ レスポンシブ*/
@media screen and (min-width: 520px) {
 body {
  padding: 0;
  font-size: 14px;
 }
 .PanList{
  width: 80%;
 }
 .contact_field{
  width: 380px;
 }
}
@media screen and (min-width: 960px) {
 
}