@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&display=swap');

body {
	margin:0;
	padding:0;

background: #fff url(images/ber3color_60.png) top repeat-x;
    
font-size:16px; 
font-family: 'Zen Maru Gothic',  'メイリオ', Meiryo,'ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
    font-weight: 500;
line-height:1.5;
color:#000;
box-sizing: border-box;
}



a{
	text-decoration: none;
	border:none;
    color:#FF6986;
}

a:hover {opacity: 0.6;
  filter: alpha(opacity=60);}

a:hover img{
	opacity: 0.6;
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;}



.pc{display: block;}
.smp{display:none;}

h1,h2,h3{margin:0; padding:0}
p{margin:1em 0;}

.caption{font-size:10px; background: #fff;}


#share{width:80%; max-width: 768px;  margin:2em auto; text-align: center;}

.page_top{
	position:fixed;
	bottom:20px;
	right:-30px;
}

.page_top img{width:140px; height:auto;}




header{width:100%; max-width:1024px; margin:0 auto; padding:0;
}

/*---インデックス--*/

#header{width:100%; 
background:url(images/ber3color_60.png) repeat-x,
 url(images/main_image_pc.jpg) center center/contain no-repeat;

}

#header h1{width:100%; padding:1.5em 0 0 1em;}

#header h1 img{display:inline-block; width:auto; height:140px; margin:auto;}

#header .concour_info{width:52%; margin:1em 0 0 1em;}


#header .tokuten{width:40%; margin:1em 0 0 1em; background: url(images/bg_dotC.png); padding: .5em 1em;}

#header .tokuten img{display:block; width:100%; height:auto;}

.update{text-align: center;}
.update span{color: crimson; border:solid 1px crimson; font-size:12px; line-height: 12px; display: inline-block; padding:0 2px; margin-right:10px;}

#menu_link{display: flex; justify-content: center; align-items: center;}
#menu_link img{width:100%; max-width:320px; height:auto; margin:1em;}

#storelist{background: url(images/bg_dotC.png); padding-bottom:1em}


#storelist h2{background:url(images/ber3color_90.png) repeat-x left 75%;}
#storelist h2 img{width:90%; height:auto; max-width:510px; display: block; margin:0 auto;}

#storelist table {
	width: 90%;
	max-width: 640px;
	font-size: small;
	color: #333;
	margin:20px auto;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #364060;
	border-right-color: #364060;
    background-color: #fff;
}

#storelist th{
	background-color: #65bad1;
	color: #000;
	font-size: 1.2em;
	padding:6px 2px 2px 2px;
}


#storelist th, td{
	padding:5px;
	border-bottom: 1px solid #364060;
}

#storelist th.shoten{max-width: 280px;}	

#storelist .adr{border-left: 1px solid #364060; width: 6em;}


#storelist td, #storelist th {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #364060;
}


#storelist table tr:hover {
	background-color: #FFC;	/* 行の背景色 */
}





/*----店舗写真展----*/

#header_photo h1 img{display: inline-block; height:40px; width:auto; padding:10px 0}


#header_photo h2 img{width:90%; height:auto; max-width:510px; display: block; margin:0 auto;}


#contents{width:98%; max-width: 1024px; margin:1em auto;}

.storephoto h3{background: #83c900; padding:3px; font-size:1.2em} 
.storephoto h4{font-size:1.2em; margin:.5em 0 2px 0;}
.area{display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom:2em;}

.storephoto article{width:calc(100% / 4 - .7em * 3); height:auto; margin:.7em;}
.storephoto article img{display: block; width: 100%; height:auto;}


/*----結果発表----*/

article>div{margin-bottom:50px;}

.award h3{height:100px; background:url(images/ber3color_90.png) repeat-x; text-align: center;}

.award h3 img{height:78px; width: auto; vertical-align:bottom; display: inline-block; margin-top:5px}

.award h4{text-align: center;}
.award h4 span{font-size:1.6em; background: #fffea4;}



.award .photo01 img {width:auto; height:200px; margin:6px 3px;}
.award .photomain01 img{max-width:640px; width:96%; display: block; margin: 10px auto;}

.award .photomain02 img{max-width:420px; width:96%; display: block; margin: 10px auto;}

.award .photomain03{text-align: center;}
.award .photomain03 img{max-width:420px; width:96%; display: inline-block; margin: 10px auto;}

.award .photomain04{text-align: center;}
.award .photomain04 img{max-width:320px; width:96%; display: inline-block; margin: 10px auto;}

.comment{padding:1em; border-radius: 10px; border:solid 1px #65bad1; width:85%; margin:auto auto 2em auto;}
.comment_midashi{display: block; padding:5px 1em; border-radius: 10px; background: #65bad1; font-size:1.2em; margin:.5em auto; width:85%; text-align: center;}

@media screen and (max-width: 480px){
 

body{font-size:14px;}

.pc{display: none;}
.smp{display:block;}
    

#header h1{width:100%; padding:1em 0 0 0;}    

#header h1 img{display:block; width:85%; height:auto; margin:auto;} 
    
#header{width:100%; 
background:url(images/ber3color_60.png) repeat-x,
 url(images/main_image_smp.jpg) center 120px/contain no-repeat;
}
    
    
#header .concour_info{width:90%; margin:230px 0 0 1em; background:rgba(255,255,255,1);}
    
#header .concour_info p{padding:.5em .5em 0 .5em}


#header .tokuten{width:100%; margin:1em 0 0 0; background: url(images/bg_dotC.png); padding: .5em 0;}
    

    
#header .tokuten .caption{margin:0 1em}  
    
    

#menu_link{display: block;}
#menu_link img{display: block; width:80%; height:auto; margin:.5em auto;}
    
    
#storelist tr{font-size:12px;}
#storelist .adr{width: 4em}
    
.page_top img{width:120px; height:auto;}
    
    
/*----店舗写真展----*/
    
#header_photo h1{text-align: center; height:40px;}
    #header_photo h3{margin-top:20px;}   
.storephoto h4{font-size:.9em;}
.storephoto article{width:calc(100% / 2 - .7em * 2);}

}


@media screen and (max-width: 320px){

}


#home{text-align: center; height:60px;
    background:url(images/ber3color_60.png) repeat-x top center;}

#home a{display: inline-block; margin-top:18px}


footer {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #999;
	width: 100%;
	text-align: center;
    background: #fff;
}
  @media screen and (min-width: 768px) {
    footer {
      width: 100%;
      margin: -2px auto 0; } }
  @media screen and (max-width: 767px) {
    footer {
      margin-top: -2px; } }
  footer .footer_nav {
	background-color: #fff;
}
    footer .footer_nav ul {
      text-align: center;
      padding: 15px 0; }
      footer .footer_nav ul li {
        display: inline-block;
        font-size: 13px;
        padding: 0 10px;
        border-left: 1px solid #666; }
        footer .footer_nav ul li:last-child {
          border-right: 1px solid #666; }
        @media screen and (max-width: 767px) {
          footer .footer_nav ul li:nth-child(1) {
            margin-bottom: 10px; }
          footer .footer_nav ul li:nth-child(2) {
            margin-bottom: 10px;
            border-right: 1px solid #666; } }
        footer .footer_nav ul li a {
	color: #666;
	text-decoration: none;
	cursor: pointer;
}

  footer .copyright {
    font-size: 9px;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px; }