* {
margin: 0px;
padding: 0px;
}
html {
margin-bottom:1px;
height:auto;
scroll-behavior: smooth;

}
body {
font-family:sans-serif;
text-align: center;
/color: #330000;
width:100%!important;
height:auto;
margin:0 auto!important;
max-width:100%!important;
position:relative;
/*background-color:#5a874c;*/
background-image:url(../images/bg.jpg);
background-repeat:repeat-x;
background-position:center center;
background-size:1px 100vh;
background-size: contain;
padding-bottom: 50px;
box-sizing: border-box;
border-top:solid 5px #f36f97;
}
body:before {
display: none!important;
}
html>body {
font-size : 14px;
}
h1, h2, h3, h4, h5 {
font-weight: normal;
}
img {
margin: 0px;
padding: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
image-rendering: -webkit-optimize-contrast!important;
-webkit-backface-visibility: hidden;
}
ul {
list-style-image: none;
list-style-type: none;
}
li {
margin: 0px;
padding: 0px;
}
em{
visibility: hidden;
display: none;
}

.align_left {
text-align: left;
}
.align_right {
text-align: right;
}

.clear {
clear: both;
}
.left {
float: left;
}
.right {
float: right;
}
.clearfix:after {
content:".";
display:block;
margin:0px;
padding:0px;
height:0;
visibility:hidden;
clear:both;
overflow:hidden;
font-size:0.1em;
}
.clearfix {
min-height:1px;
}
* html .clearfix {
/*\*//*/
height:auto;
overflow:hidden;
/**/
}

a , a:visited{
color:#cf5557;
text-decoration:none;
}
header{
height:auto;
margin:0 auto;
padding:0!important;
font-size:20px;
font-weight:bold;
width:100%;
}
header img{
width:100%;
max-width:450px;
margin:0 auto;
padding:0!important;
}
footer{
width:100%;
min-height:50px;
height:auto;
margin:0 auto;
padding:0!important;
font-size:12px;
font-weight:bold;
position: absolute;
bottom: 0;
background-color:rgba(0,0,0,0.1);
display:flex;
justify-content:center;
align-items: center;
flex-wrap: wrap;
}
footer p{
width:100%;
margin:5px auto;
}
footer address{
width:100%;
font-style:normal;
color:#ffffff;
font-size:12px;
font-weight:bold;
text-align:center;
}
main {
height:auto;
width:100%;
max-width:1024px!important;
margin:0 auto;
padding:0 0 30px 0!important;
position:relative;
text-align:center;
font-weight:bold;
}

.wrapper{
width:100%;
height:auto;
margin:0 auto;
}

.pageback{
width:98%;
margin:30px auto;
padding:0;
font-size:18px;
font-weight:bold;
text-align:right;
}
.pageback img{
margin:0 0 0 10px;
width:16px;
}
.breadcrumbs{
width:96%;
margin:20px auto 30px auto;
padding:10px 3px;
text-align:left;
font-size:15px;
font-weight:bold;
background-color:rgba(255,255,255,0.6);
}
h3{
width:100%;
height:70px;
background-image:url(../images/title_left.png);
background-position:1px 0px;
background-repeat:no-repeat;
background-size:contain;
position:relative;
margin:10px auto 30px auto;
}
h3 div{
position:absolute;
z-index:2;
width:calc(100% - 60px);
padding:5px;
margin:10px auto 0 auto;
background-color:#f36f97;
border-radius:9999px;
top:0;
left:25px;
right:25px;
color:#ffffff;
font-weight:bold;
font-size:22px!important;
}
h3 img{
position:absolute;
z-index:3;
bottom:2px;
right:1px;
width:50px;
}
h4{
line-height:1.8em;
}



/*　トップページ　*/
.toppage{
width:100%;
height:auto;
margin:30px auto;
}
.toppage h3{
margin:0 auto 15px auto;
font-weight:bold;
font-size:24px!important;
}
.toppage h4{
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.toppage p{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.toppage .concept{
width:94%!important;
margin:0 auto 30px auto;
font-size:16px;
line-height:1.8em;
font-weight:bold;
text-align:left!important;
}
.toppage .login_box{
width:98%;
margin:0 auto 30px auto;
font-size:16px;
line-height:1.8em;
font-weight:bold;
}
.username,.password{
width:80%;
font-size:1.1em;
padding:5px;
margin:0 auto 20px auto;
}
.button_div{
margin:0 auto 20px auto;
}
.buttons{
display:block;
width:60%;
margin:30px auto;
padding:5px 0;
font-size:16px;
font-weight:bold;
}
.link-text{
margin:0 auto 30px auto;
}
.link-text a{
display:block;
margin:10px auto 0 auto;
}




/*　マイページ　*/
.mypage_box{
width:100%;
height:auto;
margin:30px auto;
}
.mypage_box h3{
margin:0 auto 20px auto;
font-weight:bold;
font-size:24px!important;
}
.mypage_box h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
p.sponsored{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.line{
margin:15px auto 0 auto;
width:90%;
border:none;
height:1px;
background-color:#cf5557;
}
.main_menu{
width:98%;
height:auto;
margin:0 auto 50px auto;
display:flex;
flex-wrap: wrap;
justify-content: space-around;
}
.main_menu a{
display:block;
width:calc(49% - 3px);
padding:11px 0 9px 0;
margin:0 auto 5px auto;
border:solid 3px #f5e2e2;
border-radius:6px 6px;
text-align:center;
font-weight:bold;
font-size:16px!important;
background-color:rgba(255,255,255,0.8);
display:flex;
justify-content:center;
align-items: center;
}
.main_menu a.main_menu_l{
display:block;
width:calc(99% - 3px);
padding:11px 0 9px 0;
margin:0 auto 3px auto;
border:solid 3px #f5e2e2;
border-radius:6px 6px;
text-align:center;
font-weight:bold;
font-size:16px!important;
background-color:rgba(255,255,255,0.8);
display:flex;
justify-content:center;
align-items: center;
}
.stamp_area{
width:100%;
height:auto;
margin:0 auto 40px auto;
}
.stamp_bt{
width:96%;
height:auto;
margin:10px auto 40px auto;

}
.stamp_bt a{
display:block;
width:calc(99% - 4px);
padding:11px 2px 9px 0;
margin:5px auto;
border:solid 3px #f5e2e2;
border-radius:6px 6px;
text-align:center;
font-weight:bold;
font-size:18px!important;
background-color:rgba(255,255,255,0.8);
display:flex;
justify-content:center;
align-items: center;
}
.bt_icon{
width:19px;
height:19px;
margin:0 3px 0 0;
}
.prize_title{
width:100%;
padding:0;
margin:0 auto 10px auto;
text-align:center;
font-weight:bold;
font-size:20px!important;
}
.prize_info{
width:96%;
padding:10px 0;
margin:20px auto 10px auto;
text-align:center;
font-weight:bold;
font-size:18px!important;
display:flex;
flex-wrap: wrap;
justify-content:space-around;
align-items: center;
background-color:rgba(255,255,255,0.6);
}
.prize_info p{
width:90%;
font-size:16px!important;
line-height:1.8em;
padding:0;
margin:10px auto;
text-align:left;
}
.prize_info p.click_message{
width:90%;
font-size:16px!important;
line-height:1.8em;
padding:0;
margin:10px auto;
text-align:center;
}
.prize_info .prize_l{
width:50%;
margin:8px auto;
padding:0;
color:#999999;
}
.prize_info .prize_s{
width:calc(100% / 3);
margin:8px auto;
padding:0;
color:#999999;
}
.prize_info a{
width:100%;
display:inline-block;
}
.prize_info a img{
vertical-align:-3px;
}
.no_prize{
font-size:14px!important;
color:#999999;
margin:10px auto 0 auto;
}
.system_area{
width:100%;
height:auto;
margin:0 auto 30px auto;
padding:10px 0;
background-color:rgba(255,255,255,0.6);
}
.system_box{
width:96%;
margin:10px auto;
font-size:16px!important;
line-height:1.8em;
}
.system_box h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.system_box li{
margin:0 auto 10px auto;
font-size:16px!important;
line-height:1.8em;
}
.wpmem_msg{
width:96%!important;
margin:10px auto 30px auto!important;
line-height:1.8em!important;
}
.disable_link a{
display:none;
}

/*　正解・不正解　*/
.correct_box{
width:100%;
height:auto;
margin:30px auto;
}
.correct_image{
margin:0 auto 30px auto;
}
.correct_image img{
margin:0 auto;
width:150px;
height:auto;
}
.correct_box h2{
margin:0 auto 20px auto;
font-weight:bold;
font-size:24px!important;
position:relative;
}
.correct_box h2 .char{
position:absolute;
right:calc(25% - 65px)!important;
top:-100px!important;
max-width:130px!important;
width:25vw!important;
}
.correct_box h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.correct_box h4:before{
content:"A.";
font-size:1.4em;
margin:0 10px 0 0;
}
.correct_text{
width:calc(95% - 30px);
margin:0 auto;
padding:15px;
text-align:left;
line-height:1.8em;
font-size:16px;
font-weight:bold;
background-color:rgba(255,255,255,0.6);
}
.correct_pict{
display:block;
margin:15px auto!important;
text-align:center;
width:calc(95% - 30px);
max-width:600px;
height:auto;
}


/*　スタンプカード　*/
.stamp_box{
width:98%;
height:auto;
margin:50px auto;
}
.stamp_box h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.stamp_box h4{
margin:0 auto 20px auto;
padding:5px 0;
font-weight:bold;
font-size:20px!important;
/*background-color:#cf5557;*/
color:#000000;
/*color:#ffffff;*/
}
table.card{
width:100%;
border-collapse:  collapse;
margin:0 auto 50px auto;
background-color:rgba(255,255,255,0.8);
}
table.card tr.stamp_image{
height:70px;
text-align:center;
}
table.card td{
height:auto;
border:solid 1px #999999;
padding:10px 0;
text-align:center;
width:calc(100% / 3);
font-size:0.9em;
font-weight:bold;
}

table.card td.history_st{

background-image:url(../images/reki_bg.png);
background-position:center center;
background-repeat:no-repeat;
background-size:40px;
}


table.card td.sakura_st{
background-color:rgba(255,229,229,0.5);
background-image:url(../images/sakura_bg.png);
background-position:center center;
background-repeat:no-repeat;
background-size:40px;
}




table.card tr.stamp_image td img{
width:50px;
height:50px;
}
.title_tamura{
background-color:#d5e269;
/*background-color:#dfb672;*/
}
.title_miharu{
background-color:#f6b9b3;
/*background-color:#d29a9d;*/
}
.title_ono{
background-color:#9fd9f7;
/*background-color:#6c8333;*/
}










/*　問題　*/
.question_area{
width:100%;
height:auto;
margin:30px auto;
}

.question_area h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.question_area h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}

.question{
width:calc(98% - 12px);
margin:30px auto;
padding:10px 5px;
border:solid 3px #ffffff;
border-radius:6px 6px;
text-align:left;
font-size:1.2em;
font-weight:bold;
line-height:1.6em;
background-color:rgba(255,255,255,0.8);
display:flex;
justify-content:center;
align-items: center;
}
.question:before{
content:"Q.";
font-size:1.4em;
margin:0 10px 0 0;
}
ul.answer{
width:98%;
margin:0 auto;
display:flex;
flex-wrap:wrap;
}
ul.answer li{
width:calc(100% - 12px);
padding:10px 5px;
margin:10px auto;
border-radius:5px 5px;
font-size:1.2em;
border:solid 3px #ffffff;
background-color:rgba(255,255,255,0.8);
display:flex;
justify-content:center;
align-items: center;
}
ul.answer li:nth-of-type(1) a:before{
content:"① ";
font-size:1.4em;
}
ul.answer li:nth-of-type(2) a:before{
content:"② ";
font-size:1.4em;
}
ul.answer li:nth-of-type(3) a:before{
content:"③ ";
font-size:1.4em;
}

ul.answer li a{
display:block;
width:100%;
height:100%;
text-align:center;
font-size:1em;
font-weight:bold;
}



/*　プロフィール　*/
.profile{
width:100%;
height:auto;
margin:30px auto;
}
.profile h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.profile h4{
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.profile .system_area{
width:96%;
height:auto;
margin:50px auto 100px auto;
padding:10px 0;
background-color:rgba(255,255,255,0.6);
}
.profile .system_box{
margin:10px auto;
font-size:16px!important;
line-height:1.8em;
}
.profile .system_box li{
margin:0 auto 10px auto;
font-size:16px!important;
line-height:1.8em;
}
/*　ユーザー登録　*/
.registration{
width:100%;
height:auto;
margin:30px auto;
}
.registration h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.registration input, .registration select, .registration textarea {
font-size: 100%;
}
#wpmem_reg .form label.text,#wpmem_reg .form label.select,#wpmem_reg .form label.multicheckbox{
text-align:left;
font-size:1.1em;
margin:15px auto 10px auto!important;
padding:0 0 0 15px;
display:block!important;
}
#wpmem_reg .form .textbox{
text-align:center;
margin:0 auto 15px auto;
width:80%;
padding:5px;
}
#wpmem_reg .form .dropdown{
text-align:center;
margin:0 auto 15px auto;
width:80%;
padding:5px;
}
#wpmem_reg .form .div_multicheckbox input{

margin:0 auto 10px auto!important;
padding:0;
display:inline!important;
}
#wpmem_reg .form .div_multicheckbox label.multicheckbox{
font-size:1em;
margin:0 auto 10px auto!important;
padding:0;
display:inline!important;
}
#wpmem_reg .form .button_div{
margin:0 auto 20px auto;
}
#wpmem_reg .form .buttons{
display:block;
width:60%;
margin:30px auto;
padding:5px 0;
font-size:16px;
font-weight:bold;
}
#wpmem_reg .form .req-text{
font-size:14px;
margin:0 auto 30px auto;
}

.newreg,.go_mypage{
width:98%!important;
height:auto!important;
margin:50px auto;
display:flex!important;
justify-content:center;
align-items: center;
}
.newreg a,.go_mypage a{
width:calc(100% - 16px)!important;
height:auto!important;
margin:0 auto;
padding:10px 5px;
border:solid 3px #ffffff;
border-radius:6px 6px;
text-align:center;
font-size:1.2em;
font-weight:bold;
line-height:1.6em;
background-color:rgba(255,255,255,0.8);
display:flex!important;
justify-content:center;
align-items: center;
}

.link-text-forgot{
margin:0 auto;
padding:20px 0 0 0!important;
display:block;
font-size:1.2em;
font-weight:bold;
}

.link-text-forgot a{
width:calc(98% - 16px)!important;
height:auto!important;
margin:20px auto 50px auto;
padding:10px 5px;
border:solid 3px #ffffff;
border-radius:6px 6px;
text-align:left;

font-weight:bold;
line-height:1.6em;
background-color:rgba(255,255,255,0.8);
display:block!important;
display:flex!important;
justify-content:center;
align-items: center;
}



/*　ニュース　*/
.news_area{
width:calc(94% - 10px);
margin:30px auto;
padding:0;
text-align:left;

}
.news_area h3{
margin:30px auto;
font-weight:bold;
font-size:24px!important;

text-align:center;
}
.news_area h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.news_list{
width:calc(100% - 10px);
height:60%;
overflow:auto;
margin:0 auto!important;
padding:30px 5px 15px 5px;
background-color:rgba(255,255,255,0.6);
}
.news_list li{
margin:0 auto 15px auto;
padding:0 0 14px 0;
border-bottom:dotted 1px #cf5557;
}
.news_top{
display:flex;
margin:0 auto 10px auto;
}
.news_date{
font-size:1.1em;
font-weight:bold;
margin:0 10px 0 0;
}
.news_icon{
font-size:1em;
margin:0;
padding:1px 10px;
font-weight:normal;
color:#ffffff;
}
.icon_normal{
background-color:#0099ff;
}
.icon_tamura{
background-color:#dfb672;
}
.icon_miharu{
background-color:#d29a9d;
}
.icon_ono{
background-color:#6c8333;
}
.news_title{
margin:0 auto;
text-align:left;
font-size:1.1em;
font-weight:bold;
}
.news_title a{
color:#cf5557;
font-weight:bold;
}
.news_title a:hover{
color:#cf5557;
}

h4.news_name{
margin:30px auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.news_box{
width:calc(100% - 20px);
height:auto;
margin:10px auto 30px auto;
padding:10px;
background-color:rgba(255,255,255,0.6);
}
.news_text{
margin:15px auto;
text-align:left;
font-size:1.1em;
font-weight:normal;
line-height:1.8em;
}
.news_pict{
margin:15px auto 30px auto;
width:100%;
height:auto;
display:flex;
justify-content:center;
align-items: center;
}
.news_pict img{
object-fit: contain;
object-position: center center;
width: 100%;
max-width:600px;
height:100%;
max-height:600px;
}
.news_links{
margin:30px auto 15px auto;
text-align:right;
font-size:1.1em;
font-weight:bold;
}


/*　トップニュース　*/
.top_news_area{
width:calc(96% - 10px);
height:auto;
margin:40px auto;
padding:10px 5px 15px 5px;
background-color:rgba(255,255,255,0.6);
}
.top_news_area h3{
margin:30px auto;
font-weight:bold;
font-size:24px!important;
text-align:center;
}
.top_news_area .news_area h4{
margin:0 auto 30px auto;
font-weight:bold;
font-size:18px!important;
}
.top_news_area .news_list{
width:calc(100% - 10px);
height:auto;
margin:10px auto;
padding:0 5px;
background-color:rgba(255,255,255,0);
}
.top_news_area .news_list li{
margin:0 auto 15px auto;
border-bottom:dotted 1px #cf5557;
}
.top_news_area .news_date{
font-size:1.1em;
font-weight:bold;
line-height:1.7em;
margin:0;
padding:0 10px 0 0!important;
}
.top_news_area .news_title{
margin:0 auto;
text-align:left;
font-size:1.1em;
font-weight:bold;
line-height:1.7em;
}
.top_news_area .news_title a{
color:#cf5557;
}




/*　お問い合わせ　*/
.contact_area {
width:100%;
height:auto;
margin:30px auto;
}
.contact_area h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.contact_area h4 {
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.prize_sample{
width:90%;
max-width:500px;
margin:20px auto 50px auto;
}
.prize_sample img{
width:100%;
}
p.form_message {
width:80%;
font-size:1.2em;
line-height:1.6em;
margin:5vw auto 8vw auto;
text-align:left;
}
table.form_table {
width:96%!important;
margin:0 auto!important;
padding:0!important;
height:auto!important;
}
table.form_table tbody,table.form_table tr,table.form_table td p {
margin:0 auto!important;
padding:0!important;
height:auto!important;
}
table.form_table tr.colored{
background-color:rgba(255,255,255,0.8);
}
table.form_table td {
padding:10px!important;
font-size:1em;
font-weight:600;
word-break:break-all;
line-height:1.6em;
vertical-align:middle!important;
text-align:left;
}
table.form_table td.left_cell{
width:40%!important;
font-size:1.1em!important;
text-align:center;

}
table.form_table td.left_cell2{
width:25%!important;
font-size:1em!important;
text-align:center;
}
table.form_table td span.mini_text {
margin:5px 0 5px 0!important;
font-size:0.7em!important;
color:#666666!important;
font-weight:bold;
}
table.form_table td span.mini_text2 {
margin:5px 0 5px 0!important;
font-size:0.7em!important;
color:#d11f0b!important;
line-height:1em!important;
}
table.form_table td input[type="text"] {
font-size:1.2em!important;
padding:0.3em 3px;
width:calc(100% - 6px)!important;
}
table.form_table td textarea {
font-size:1em!important;
width:calc(100% - 6px)!important;
line-height:1.8em;
padding:0.3em 3px;
}
table.form_table td input[type="email"] {
font-size:1.2em!important;
padding:0.3em 3px;
width:calc(100% - 6px)!important;
}
table.form_table td input[type="tel"] {
font-size:1.2em!important;
padding:0.3em 3px;
width:calc(100% - 6px)!important;
}
table.form_table td input#zip,table.form_table td input#zip2 {
width:40px!important;
}
span.button_margin lavel {
padding:0 2em 0 0;
display:inline-block;
}
input.readonly {
border:none;
font-size:1em;
background-color:transparent;
line-height:2em;
font-weight:normal;
}
input.hiddenly {
display:none
}
input.text_input{
width:100%!important;
}
input.text_input2{
width:100%!important;
padding:0.3em!important;
font-size:1.3em!important;
height:1.3em!important;
}
input.num_input2{
width:100%!important;
padding:0.3em!important;
font-size:1.3em!important;
height:1.3em!important;
}
textarea.area_input{
width:100%!important;
}
textarea.area_input2{
width:100%!important;
height:6em;
padding:0.2em!important;
font-size:1.2em!important;
}
tr.line input.readonly{
background-color:none;
}
div.form_button {

text-align:center!important;
margin:0px auto!important;
padding:0.5vw 0;
}
td.form_button_cell{
width:100%!important;
text-align:center!important;
margin:0px auto!important;
padding:0.5vw 0;
}
div.form_button p {
margin:0px auto!important;
}
div.form_button a {
margin:0px auto!important;
color:color:#d11f0b!important;
}
input[type="button"],input[type="submit"] {
-webkit-appearance: none;
}
input.submit_button,wpcf7-submit {
width: 100%;
height: 40px;
text-align: center;
text-decoration: none;
line-height: 40px;
outline: none!important;
background-color: #ffffff;
color: #333333;
border:none;
cursor:pointer;
margin:0 auto!important;
font-size:1.1em!important;
font-weight:600;
}
span.alert {
font-size:0.9em;
color:#d11f0b!important;
font-weight:bold;
padding:0;
}
.screen-reader-response{
visibility:hidden;
display:none;
}
.wpcf7-not-valid-tip{
font-size:0.7em;
color:#d11f0b!important;
font-weight:bold;
padding:0 0 0 1em;
}
.wpcf7-not-valid-tip:before{
content: "\A";
white-space: pre;
}
.wpcf7-validation-errors,.wpcf7-response-output{
font-size:1em;
color:#d11f0b!important;
font-weight:bold;
text-align:center;
padding:5px 0;
}
.wpcf7-list-item-label{
margin:0 1vw 0 0.5vw;
}
.contact_message{
width:90%;
margin:20px auto 50px auto;
font-weight:bold;
font-size:1.2em!important;
text-align:left;
}
.thanks{
font-size:1.1em;
font-weight:bold;
margin:20px auto;
}


/*　その他　*/
.others{
width:100%;
height:auto;
margin:30px auto;
}
.others h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}

/*ログインボックス*/
.log_area{
width:100%;
height:auto;
margin:30px auto;
}
.log_area h4{
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}



/*　問題一覧　*/
.p_list{
width:100%;
height:auto;
margin:30px auto;
}
.p_list h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.p_list h4{
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
color:#ffffff;
}
.p_list_box{
margin:30px auto;
display:flex;
}
.p_list_box a{
margin:0 auto 10px auto;
display:block;
width:calc(100% / 3);
font-size:1.2em;
}
.p_list hr{
margin:0 auto 30px auto;
width:98%;
}





.contents{
width:calc(96% - 30px);
margin:0 auto 50px auto;
padding:15px;
}
.contents ul{
margin:0 auto 30px auto;
padding:0;
}
.contents li{
font-weight:bold;
font-size:18px!important;
text-align:left;
margin:10px auto;
background-color:rgba(255,255,255,0.8);
padding:10px 10px 10px 65px;
min-height:55px;
}
.contents li.icon_1{
background-image:url(../images/icon_1.png);
background-position:5px 5px;
background-repeat:no-repeat;
background-size:50px;
}
.contents li.icon_2{
background-image:url(../images/icon_2.png);
background-position:5px 5px;
background-repeat:no-repeat;
background-size:50px;
}
.contents li.icon_3{
background-image:url(../images/icon_3.png);
background-position:5px 5px;
background-repeat:no-repeat;
background-size:50px;
}
.contents li.arrow{
padding:5px 0;
margin:10px auto;
background-color:rgba(255,255,255,0);
text-align:center;
min-height:auto;
}
.contents li.arrow img{
float:none;
width:30px;
height:auto;
}

.contents li img{
float:right;
width:100px;
height:auto;
}
.supplement{
font-weight:bold;
font-size:16px!important;
text-align:left;
margin:10px auto;
}
.cautionary{
font-weight:bold;
font-size:16px!important;
text-align:left!important;
margin:20px auto 30px auto;
}
.cautionary p{
font-weight:bold;
font-size:16px!important;
text-align:left!important;
margin:10px auto;
}
.contents h4{
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.contents .alert_pict{
margin:15px auto;
width:90%;
}
.conditions{
margin:0 auto;
padding:5px 10px;
background-color:rgba(255,255,255,0.8);
text-align:left!important;
width:calc(96% - 20px);
}
.conditions div{
font-weight:bold;
font-size:20px!important;
text-align:left!important;
margin:10px auto;
color:#cf5557;
}
.conditions p{
font-weight:bold;
font-size:16px!important;
text-align:left!important;
margin:5px auto 15px auto;
padding:0 0 0 10px;
}
.conditions p span{
display:block;
font-size:14px!important;
}

.about{
width:calc(96% - 30px);
margin:0 auto;
padding:15px;
}
.about h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.about h4 {
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.about .about_text{
margin:0 auto 30px auto;
padding:0;
font-size:16px;
line-height:1.8em;
text-align:left;
}
.about ul{
margin:0 auto 30px auto;
padding:0;
}
.about li{
font-weight:bold;
font-size:16px!important;
text-align:left;
margin:5px auto;
}
.about li:before{
content:"・";
margin:0 5px 0 0;
display:inline-block;
}


.intro{
width:calc(96% - 30px);
margin:0 auto;
padding:15px;
}
.intro h3{
margin:0 auto 30px auto;
font-weight:bold;
font-size:24px!important;
}
.intro h4 {
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.intro .intro_text{
margin:0 auto 30px auto;
padding:0;
font-size:16px;
line-height:1.8em;
text-align:left;
}
.intro p{
margin:0 auto 15px auto;
padding:0;
font-size:16px;
line-height:1.8em;
text-align:center;
}
.intro table{
margin:0 auto 30px auto;
padding:0;
font-size:16px;
line-height:1.8em;
text-align:center;
width:100%;
}
.intro table td{
margin:0;
padding:0;
text-align:center;
width:100%;
}
.intro table td img{
margin:0;
padding:0;
text-align:center;
width:100%;
max-width:600px;
}


.map{
width:calc(96% - 30px);
margin:0 auto;
padding:15px;
}
.map h3{
margin:0 auto 40px auto;
font-weight:bold;
font-size:24px!important;
}
.map h4 {
margin:0 auto 15px auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#cf5557;
color:#ffffff;
}
.map_box{
margin:0 auto 80px auto;
}
.map_box2{
margin:0 auto;
}
.map_box table{
margin:0 auto;
padding:0;
font-size:16px;
line-height:1.8em;
text-align:center;
width:100%;
}
.map_box table td{
margin:0;
padding:0;
text-align:center;
width:50%;
font-weight:bold;
}
.map_box table td img{
margin:0;
padding:0;
text-align:center;
width:90%;
}
.dl_bt{
width:70%;
margin:15px auto 0 auto;
padding:0;
}
.dl_bt a{
display:block;
width:100%;
margin:0 auto;
padding:5px 0;
font-weight:bold;
font-size:15px!important;
border-radius:6px 6px;
background-color:#cf5557;
color:#ffffff;
}




.tab{
display: flex;
flex-wrap: wrap;
z-index: 20;
}
.tab li{
width:calc((100%/3) - 4px);
margin:0 2px;
z-index: 20;
}
.tab li a{
display: block;
background-color:rgba(255,255,255,0.8);
margin:0;
padding:10px 0;
font-size:18px;
font-weight:bold;
z-index: 20;

}
.tab li.active a{
/*background-color:#cf5557;*/
color:#000000;
z-index: 20;
}
.spot_box {
display: none;
opacity: 0;
padding:5px 5px 20px 5px;
z-index: 25;
}
.tab li.active a.tab1,#genre1{
background-color:#d5e269;
}
.tab li.active a.tab2,#genre2{
background-color:#f6b9b3;
}
.tab li.active a.tab3,#genre3{
background-color:#9fd9f7;
}
.spot_box.is-active {
display: block;
animation-name: displayAnime;
animation-duration: 2s;
animation-fill-mode: forwards;
}
@keyframes displayAnime{
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.spot_box h5{
width:100%;
margin:15px auto 0 auto;
padding:5px 0;
font-weight:bold;
font-size:18px!important;
background-color:#ffffff;
}
.spot_box .map_image{
width:calc(100% - 10px);
margin:0 auto 40px auto;
padding:5px;
background-color:#ffffff;
}
.spot_box .map_image img{
width:100%;
height:auto;
}
.spot_box .map_image ul{
width:100%;
margin:10px auto 0 auto;
display:flex;
flex-wrap: wrap;
justify-content: flex-start!important;
}
.spot_box .map_image ul li{
width:50%;
margin:5px 0;
padding:0;
font-size:15px!important;
}
.spot_box .map_image ul li a{
color:#000000;
width:100%;
display:flex;
align-items: center;
}
.spot_icon{
width:20px!important;
height:20px!important;
margin:0;
vertical-align:-4px;
text-align:left;
}
.spot_box .map_image ul li a span{
display:inline-block;
padding:0 0 0 2px;
width:calc(100% - 22px);
text-align:left;
}
.spot_box .map_image p{
width:90%;
text-align:center;
margin:10px auto 5px auto;
}
.spot_info{
width:calc(100% - 10px);
margin:0 auto;
padding:5px;
background-color:#ffffff;
display:flex;
flex-wrap: wrap;
}
.spot_info .spot_info_text{
width:50%;
}
h6.spot_name{
font-weight:bold;
font-size:16px!important;
margin:20px auto 0 auto;
padding:10px 0;
background-color:#ffffff;
}
.spot_list_icon{
width:30px!important;
height:auto;
margin:0 5px 0 0;
vertical-align:-8px;
}
.spot_info .spot_info_text .spot_info_more{
font-weight:bold;
font-size:14px!important;
line-height:1.8em;
padding:0 0 10px 0;
text-align:left;
}
.spot_info .spot_info_text .spot_address{
font-weight:normal;
font-size:14px!important;
padding:0 0 10px 0;
text-align:left;
}

.spot_info .spot_info_text .google_bt{
width:100%;
margin:5px auto;
padding:0;
}
.spot_info .spot_info_text .google_bt a{
display:block;
width:100%;
margin:0 auto;
padding:5px 0;
font-weight:bold;
font-size:14px!important;
border-radius:6px 6px;
background-color:#cf5557;
color:#ffffff;
}


.spot_info .spot_info_image{
width:48%!important;
margin:0 0 0 2%!important;
}
.spot_info .spot_info_image img{
width:100%;
height:auto;
margin:0 auto;
border-radius:5px;
}

.spotback{
width:98%;
margin:10px auto 30px auto;
padding:0;
font-size:16px;
font-weight:bold;
text-align:right;
}
.spotback img{
margin:0 0 0 10px;
width:12px;
}

.policy_list{
margin:10px 0 10px 5px;
font-size:0.9em;
}
.policy_list p{
margin:0 auto 15px auto!important;
padding:0 0 0 10px!important;
list-style-type: none!important;
line-height:1.6em;
}
.policy_list p:before{
content:"・";
}

.colored_text{
color:#cf5557;
font-size:1.2em;
font-weight:bold;
}
@media screen and (min-width:390px) {
.small_box{
display:none;
}
}
@media screen and (max-width:389px) {
.small_box{
display:inline;
}
}

#wpmem_register_form label:first-of-type:after{
content:" ※半角英数字のみ";
}
#wpmem_register_form label:nth-of-type(3){
visibility:hidden!important;
font-size:0.01em!important;
}
#wpmem_register_form label:nth-of-type(3):before{
content:"メールアドレス確認* ※同じメールアドレスを確認の為、再度入力ください";
visibility:visible!important;
display:inline!important;
font-size:110em!important;
width:100%!important;
}
#wpmem_register_form label:nth-of-type(4):after,#wpmem_register_form label:nth-of-type(5):after{
content:" ※半角英数字のみ 8字以上";
}

#wpmem_pwdchange_form label:nth-of-type(2):after{
content:" ※半角英数字のみ";
}

#wpmem_register_form .div_multicheckbox label:first-of-type:after,#wpmem_login_form label:first-of-type:after,#wpmem_profile_form label:first-of-type:after{
content:"";
}
#wpmem_register_form .div_multicheckbox label:nth-of-type(3),#wpmem_login_form label:nth-of-type(3),#wpmem_profile_form label:nth-of-type(3){
visibility:visible!important;
font-size:1.1em!important;
}
#wpmem_register_form .div_multicheckbox label:nth-of-type(3):before,#wpmem_login_form  label:nth-of-type(3):before,#wpmem_profile_form label:nth-of-type(3):before{
content:"";
}
#wpmem_register_form .div_multicheckbox label:nth-of-type(4):after,#wpmem_register_form .div_multicheckbox label:nth-of-type(5):after,#wpmem_login_form label:nth-of-type(4):after,#wpmem_login_form  label:nth-of-type(5):after,#wpmem_profile_form label:nth-of-type(4):after,#wpmem_profile_form label:nth-of-type(5):after{
content:"";
}





CSS
#box1 {
width: 300px;
height: 200px;
margin-left: auto;
    margin-right: auto;
background-color: blue;
text-align: center;
color: #fff;
}


#box2 {
width: 300px;
height: 200px;
margin-left: auto;
    margin-right: auto;
background-color: red;
text-align: center;
color: #fff;
display: none;
}

#box1 {
width: 300px;
height: 200px;
margin-left: auto;
    margin-right: auto;
background-color: blue;
text-align: center;
color: #fff;
}
 
 
#box2 {
width: 300px;
height: 200px;
margin-left: auto;
    margin-right: auto;
background-color: red;
text-align: center;
color: #fff;
display: none;
}