@charset "UTF-8";
body {
	font-size:16px;
	font-weight:500;
	font-family: Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'モリサワ 新ゴ R', 'Droid Sans', メイリオ, 'sans-serif';
	line-height:1.6;
}

a{color:#39F;}

.mr-3{margin-right:3%;}
.mt-3{margin-top:3%;}
.mb-1{margin-bottom:1%;}
.mb-3{margin-bottom:3%;}
.my-0{margin-top:0; margin-bottom:0;}

.left{float:left;}
.right{float:right;}
.clear{clear:both;}

/* clearfix */
.clearfix:after{
  content: ".";  /* Vvf */
  display: block;  /* ubNxvf */
  clear: both;
  height: 0;
  visibility: hidden;
}

.hide{display:none;}
.seek{visibility: hidden;}


section#ramen-present{width:100%; padding:3%; box-sizing:border-box; margin:0 auto 5%; background:#DCDCDC;}
section#ramen-present input{width:70%;}
details{padding:3%;}
details summary{width:60%; margin:1% auto; padding:3%; box-sizing:border-box; background:#9C0002; text-align:center; color:#fff;}

/* --------------------------------
 * PC用の整形
 * -------------------------------- */
 
#wrapper{margin:0 auto; box-sizing:border-box; line-height:1.5; color:#000;}

h1#page-title{font-size:32px; margin:2% auto; text-align: center;}

section.title_box{
	width:100%;
	margin:2.5%;
	/*padding:5%;*/
	box-sizing:border-box;
	/*background:#f39800;*/
}
section.title_box h2{
	text-align: center;
	font-size:24px;
	font-weight:bolder;
}
section.title_box p{
	text-align:center;
	font-size:16px;
	line-height:1.6;
}

.form_box{font-size:16px;}
.form_box dl{width:95%; margin:0 auto 2.5%; }
.form_box dl dt{
background:#f39800;
font-weight: bold;
font-size:17px;
padding:1.5%;
margin-bottom:2.5%; 
}
.form_box dd{margin-left:2%;}


/*ラジオボタン周り*/
.radio{display:flex;}
.radio li{min-width:100px;}
.radio li label{display:block; padding:5% 3% 3%; border:1px solid #ccc; border-radius:50px; text-align:center;}
.radio li label input[type="radio"]{ margin-left:-15%;}
#gender li label input{cursor: pointer; visibility:hidden;}
#gender li label{
    border: 1px solid gray;
    background-color:#fff;
    font-size: 15px;
    color: #303030;
    cursor: pointer;
}
#gender li label:hover {
    border: 1px solid green;
    background-color:#00D038;
    color: #fff;
}

#unique li label input {cursor: pointer; visibility:hidden;}
#unique li label {
    border: 1px solid gray;
    background-color:#fff;
    font-size: 15px;
    color: #303030;
    cursor: pointer;
}
#unique li label:hover {
    border: 1px solid green;
    background-color:#00D038;
    color: #fff;
}

#inquiry01 li label input {cursor: pointer; visibility:hidden;}
#inquiry01 li label {
    border: 1px solid gray;
    background-color:#fff;
    font-size: 15px;
    color: #303030;
    cursor: pointer;
}
#inquiry01 li label:hover {
    border: 1px solid green;
    background-color:#00D038;
    color: #fff;
}
/*セレクト周り*/
select{-webkit-appearance:none; padding:1%; width:50%; margin-bottom:1.5%;}

/*チェックボックス周り*/
#check label{display:block; margin:2% 0;}
#check label input{margin-right:2%;}
#check label input[type="text"]{margin-top:1.5%; width:100%;}


input[type="email"],input[type="tel"],input[type="text"],textarea,select{font-size:15px; padding:1.5%; box-sizing:border-box; border-radius:5px; border:1px solid #ccc;}
input[type="email"]{width:70%;}
input[type="text"]#message1{width:90%;}
textarea{width:70%; min-height:240px;}

p.thankyou{margin:0; font-size:16px; text-align: center;}

img#present-bn{width:100%; margin:0 auto; display:block;}

/*submitボタンcss*/
.button{
     display:block;
	border:none;
	font-size:16px;
     width: 200px;
     height:60px;
	margin:3% auto 5%;
     line-height: 1.6;
     color: #FFF;
     text-decoration: none;
     text-align: center;
     background-color: #f39800; /*ボタン色*/
     border-radius: 5px; /*角丸*/
     -webkit-transition: all 0.5s;
     transition: all 0.5s;
}
.button:hover{
     background-color: #f9c500; /*ボタン色*/
}