@charset "utf-8";
/* CSS Document */

/*
Theme Name: Namihei WordPress Theme
Theme URI: http://taiyaki-namihei.com/wp/
Author: koide
Author URI: http://taiyaki-namihei.com/wp/
Description: なみへいWordPress自作テーマ
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@500;700&family=Zen+Kaku+Gothic+Antique:wght@500;700&display=swap');

/*====================================================================
プリローダー
====================================================================*/
/* Loading背景画面設定　*/
#splash {
  /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: #fffbf2;
  text-align: center;
}
/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width: 100%;
  max-width: 300px;
}
/* fadeUpをするアイコンの動き */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =============================================== */
/* basic - 共通基本設定 */
/* ----------------------------------------------- */
@media(max-width:768px) {
  .pc {
    display: none;
  }
}
@media(min-width:769px) {
  .sp {
    display: none;
  }
}
img {
  pointer-events: none;
}
/* リセットcss */
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
  margin: 0;
  padding: 0;
}
html, h1, h2, h3, h4, dl, dt, dd, ul, li, p, img {
  margin: 0;
  padding: 0;
}
ul {
  list-style-type: none;
}

/* ボディ */
body {
  font-size: 1em;
  margin: 0;
  padding: 0;
  line-height: 1.8;
  background-color: #322813;
  color: #5a4620;
  font-family: 'Zen Kaku Gothic Antique', sans-serif;
  font-weight: 500;
  -webkit-text-size-adjust: 100%;
}
a:link {
  text-decoration: underline;
  color: #d678a1;
}
a:visited {
  text-decoration: underline;
  color: #d678a1;
}
a:active {
  text-decoration: underline;
  color: #d678a1;
}
a:hover {
  text-decoration: none;
  color: #d678a1;
}

#wrapper{
	background-color: #fffbf2;
}
header{
  display: none;
}

.waku{
	position: relative;
}
.waku::before,
.waku::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
}
.waku::before {
	top: -8px;
	right: -8px;
	border-width: 0 40px 40px 0;
	border-color: transparent #d678a1 transparent transparent;
}
.waku::after {
	bottom: -8px;
	left: -8px;
	border-width: 40px 0 0 40px;
	border-color: transparent transparent transparent #769de6;
}
@media(max-width:768px) {
.waku::before {
	top: -5px;
	right: -5px;
	border-width: 0 25px 25px 0;
	border-color: transparent #d678a1 transparent transparent;
}
.waku::after {
	bottom: -5px;
	left: -5px;
	border-width: 25px 0 0 25px;
	border-color: transparent transparent transparent #769de6;
}
}

/* メイン */
#main{
  width: 100%;
  height: 800px;
  background-image: url(../img/bgMain01.png),url(../img/bgMain02.png),url(../img/bgMain03.jpg);
  background-position: left bottom,bottom,top center;
  background-repeat: no-repeat,repeat-x,no-repeat;
  background-size: contain,auto,cover;
}
@media(max-width:768px) {
  #main {background-size: contain,auto,cover; height: 700px;}
}
@media(max-width:580px) {
  #main {background-size: contain,auto,cover; height: 620px;}
}
@media(max-width:500px) {
  #main {background-size: contain,auto,cover; height: 580px;}
}
@media(max-width:468px) {
  #main {background-size: contain,30%,cover; height: 450px;}
}
h1{
  font-size: 2em;
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 700;
  writing-mode: vertical-rl;
  letter-spacing: 0.2em;
  padding: 150px 0 0 47%;
}
@media(max-width:1500px) {
  h1 {padding: 140px 0 0 60%; font-size: 2em;}
}
@media(max-width:1068px) {
  h1 {padding: 120px 0 0 70%; font-size: 1.8em;}
}
@media(max-width:860px) {
  h1 {padding: 100px 0 0 75%; font-size: 1.8em;}
}
@media(max-width:768px) {
  h1 {padding: 75px 0 0 77%; font-size: 1.7em; line-height: 1.4;text-align: left;}
}
@media(max-width:620px) {
  h1 {padding: 7% 0 0 82%; font-size: 1.5em; line-height: 1.4;text-align: left;}
}
@media(max-width:500px) {
  h1 {padding: 7% 0 0 82%; font-size: 1.3em; line-height: 1.4;text-align: left;}
}
@media(max-width:468px) {
  h1 {padding: 7% 0 0 82%; font-size: 1.2em; line-height: 1.4;text-align: left;}
}

/* イントロ */
#intro{
	width: 96%;
	max-width: 1000px;
	margin: 30px auto;
	padding: 2% 2% 5%;
}
#intro h2{
	text-align: center;
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 500;
  background-image: url(../img/hishigata.png);
  background-position: top center;
  background-repeat: no-repeat;
	padding: 100px 0 20px;
	font-size: 1.7em;
}
@media(max-width:768px) {
  #intro h2 {
	  font-size: 1.5em;
	  ont-weight: 700;
	  padding: 70px 0 20px;
	  margin-top: 20px;
	  background-size: 100px;
	}
}
.photoIntro01{
	width: 100%;
	max-width: 750px;
	margin: 10px auto 20px;
	padding: 0;
}
.photoIntro01 img{
	width: 100%;
	height: auto;
}
#intro p{
	text-align: center;
	padding: 10px;
}
@media(max-width:768px) {
  #intro p {font-size: 0.9em; padding: 10px 0;}
}
.photoShopList{
	text-align: center;
	padding: 20px 0 0;
}
.photoShopList li{
	display: inline-block;
	width: 20%;
	padding: 1%;
}
@media(max-width:768px) {
  .photoShopList li{width: 27%;}
}
.photoShopList li img{
	width: 100%;
	border-radius: 100px;
}

/* コンセプト */
#concept{
	width: 96%;
	max-width: 1000px;
	margin: 30px auto;
	padding: 2% 2% 5%;
}
#concept h2{
	text-align: center;
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 500;
  background-image: url(../img/vBorder.jpg);
  background-position: top center;
  background-repeat: no-repeat;
	padding: 75px 0 40px;
	font-size: 2em;
}
@media(max-width:768px) {
  #concept h2 {font-size: 1.5em; margin-top: 40px; padding: 75px 0 30px;}
}
.photoConcept01{
	width: 100%;
	max-width: 750px;
	margin: 10px auto 20px;
	padding: 0;
}
.photoConcept01 img{
	width: 100%;
	height: auto;
}
#concept p{
	text-align: center;
	padding: 10px;
}
@media(max-width:768px) {
  #concept p {font-size: 0.9em;}
}

/* メニュー */
#menu{
	width: 96%;
	max-width: 1000px;
	margin: 30px auto;
	padding: 2%;
}
#menu h2{
	text-align: center;
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 500;
  background-image: url(../img/vBorder.jpg);
  background-position: top center;
  background-repeat: no-repeat;
	padding: 75px 0 60px;
	font-size: 2em;
}
@media(max-width:768px) {
  #menu h2 {font-size: 1.5em; margin-top: 40px; padding: 75px 0 30px;}
}
.menuBox{
	clear: both;
	padding: 0 0 50px;
}
.photoMenu{
	width: 35%;
	max-width: 340px;
	margin: 10px auto 20px;
	padding: 0;
	float: left;
}
@media(max-width:768px) {
  .photoMenu {width: 60%; float: none;margin: 10px auto;}
}
@media(max-width:468px) {
  .photoMenu {width: 94%; float: none;margin: 10px auto;}
}
.photoMenu img{
	width: 100%;
	height: auto;
	border-radius: 10px;
}
.menuInner{
	width: 60%;
	max-width: 600px;
	margin: 0 auto 30px;
	padding: 0;
	float: right;
}
@media(max-width:768px) {
  .menuInner {width: 90%; float: none;}
}
.menuBox h4{
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 700;
	font-size: 1.4em;
	margin-bottom: 10px;
}
@media(max-width:768px) {
  .menuBox h4 {font-size: 1.2em;}
}
.menuBox h4 span{
    position: relative;
    padding: 0.7rem 10px;
    margin-bottom: 0.2rem;
    background-image: repeating-linear-gradient(140deg, transparent 0 3px, #f1e7bd 3px 6px);
    background-repeat: no-repeat;
    background-size: 100% 15px;
    background-position: left 0 bottom 8px;
}
.menuBox p{
	padding: 10px 0 0;
	font-size: 0.92em;
	line-height: 1.5;
}
.menuList{
	list-style-type: circle;
	list-style-position: outside;
	padding: 10px 0 10px 1.5em;
	border-top: 1px dotted #5a4620;
	border-bottom: 1px dotted #5a4620;
	margin-top: 15px;
}
@media(max-width:768px) {
  .menuList {list-style-type: disc;font-size: 0.9em;margin: 15px 0;}
}
.menuList li{
}

/* アクセス */
#access{
	width: 96%;
	max-width: 1000px;
	margin: 30px auto;
	padding: 2%;
}
@media(max-width:768px) {
  #access {margin: 0 auto 30px;}
}
#access h2{
	text-align: center;
  font-family: 'Shippori Mincho B1', serif;
  font-weight: 500;
  background-image: url(../img/vBorder.jpg);
  background-position: top center;
  background-repeat: no-repeat;
	padding: 75px 0 60px;
	font-size: 2em;
}
@media(max-width:768px) {
  #access h2 {font-size: 1.5em; margin-top: 40px; padding: 75px 0 30px;}
}
.map{
	width: 100%;
	max-width: 1000px;
	height: 600px;
}
@media(max-width:768px) {
  .map {width: 94%;height: 400px; margin: 0 auto;}
}
#access p{
  background-image: url(../img/footerLogo.png);
  background-position: left;
  background-repeat: no-repeat;
	padding: 0 0 0 110px;
	margin: 40px 0;
}
@media(max-width:768px) {
  #access p {
	  background: none;
	  padding: 0;
	  width: 96%;
	  margin: 20px auto;
	  font-size: 0.9em;
	}
}

/* =============================================== */
/* footer - フッター */
/* ----------------------------------------------- */
footer{
	clear: both;
  background-image: url(../img/bgFooter.jpg);
  background-position: top center;
  background-repeat: repeat;
	color: #c4b79f;
	text-align: center;
	padding: 60px 0;
}
@media(max-width:768px) {
  footer {padding: 30px 0;}
}
.sns{
	text-align: center;
	padding-bottom: 20px;
}
.sns li{
	display: inline-block;
	margin: 0 0.3em;
	font-size: 36px;
	font-weight: 500;
}
#snsIntro li a:link {
  text-decoration: none;
  color: #5a4620;
}
#snsIntro li a:visited {
  text-decoration: none;
  color: #5a4620;
}
#snsIntro li a:active {
  text-decoration: none;
  color: #5a4620;
}
#snsIntro li a:hover {
  text-decoration: none;
  color: #94825f;
}
#snsFoot li a:link {
  text-decoration: none;
  color: #fffbf2;
}
#snsFoot li a:visited {
  text-decoration: none;
  color: #fffbf2;
}
#snsFoot li a:active {
  text-decoration: none;
  color: #fffbf2;
}
#snsFoot li a:hover {
  text-decoration: none;
  color: #c4b79f;
}
.credite{
	font-weight: 500;
	letter-spacing: 0.1em;
	font-size: 90%;
}
@media(max-width:768px) {
  .credite {font-size: 80%;}
}

/* =============================================== */
/* clearfix - クリアフィックス設定 */
/* ----------------------------------------------- */
.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}
/* =============================================== */
/* other - その他 */
/* ----------------------------------------------- */
/* ほか */
.ex-large {font-size: 140%;}
.large {font-size: 120%;}
.small {font-size: 80%;}
.ex-small {font-size: 70%;}
.bold{font-weight: 700;}
.normal{font-weight: 500;}
.txtCenter {text-align: center;}
.txtRight {text-align: right;}
.mincho {font-family: 'Shippori Mincho B1', serif;}
.gothic {font-family: 'Zen Kaku Gothic Antique', sans-serif;}