@charset "UTF-8";

/* すべてのWebページに適用される */

html {
	font-family: sans-serif;
//font-family: 'Sawarabi Gothic', sans-serif;
}

html * {
	box-sizing: border-box;
}

/* ------------------------------------ */

body {
//	background-image: radial-gradient(#c5e5ee,#238ccc );
//	background-image:linear-gradient(#c5e5ee,#238ccc )
	margin: 0 0 0 0;
//	background-color: #D7EEFF;
	background-color: #238ccc;
}

/* ------------------------------------ */

.dialogbk {
    	position: absolute;

    	width: 100vw;
    	height: 100vh;

    	z-index: 200;

	background-color: rgb( 0 , 0 , 0 , 0.6 ) ;
	display: none;
}

.dialogcontent {
	position: fixed; /* ウィンドウを基準に画面に固定 */
//    	position: absolute;
	top:30vh;
	left:10vw;

//	width:10vw;
//	height:30vh;

	background-color: white;

	padding: 10px 10px 10px 10px; /* ヘッダーに上下左右それぞれ余白を指定 */

//	width: 100%; 
//	margin: 0 auto 0 auto;

//    	box-shadow: 4px 4px 16px #666;
//    	box-shadow: 2px 2px 8px #777;
	box-shadow: 8px 8px 32px #222;

//	border-style: solid; 
	border-width: 0px 0px 0px 0px ;
//	border-color: blue;
	border-radius: 20px; /* 半径が8pxの角丸 */
}

.dialogline {
	margin-top: 2px;
	margin-bottom: 4px;

	border-bottom: 2px dotted #3f5170;
}

/* ------------------------------------ */

#anicanvas {
//	background: SkyBlue;
//	border: solid 1px #888;
}

/* ------------------------------------ */

.l1 {
	position:relative;

	display: flex;
}

.l2 {
//	position:absolute;
//	top:0px; 
//	left:0px;

	width:100px;
//	height:30px;

	text-align: center;
	padding: 0px 2px 0px 2px;

	background-color: white;

	border-style: solid; 
	border-width: 2px 2px 2px 2px;
	border-color: white;
}

.l3 {
	position:absolute;
	top:0px; 
	left:0px;

	width:100px;
//	height:30px;

	border-style: solid; 
	border-width: 2px 2px 2px 2px;
	border-color: blue;
}

.l2 a:link {
	color: #3c454d;
	text-decoration: none;
}

.l2 a:hover {
	text-decoration: none;
	background-image: linear-gradient( 90deg , #402c86 , #20aad8 ) ;
	color: #ffffff ;
}

.l4 {
//	position:relative;

	display: flex;
}

/* ------------------------------------ */

.tabname {
	border-radius: 10px 10px 0px 0px; /* 半径が8pxの角丸 */
	padding: 0px 5px 0px 5px;
}

.tabs li {
	display: inline;
	list-style-type: none;
//	padding-right: 30px;
}

.tabs a:link {
	color: #3c454d;
	text-decoration: none;
}

.tabs a:hover {
	text-decoration: none;
	background-image: linear-gradient( 90deg , #402c86 , #20aad8 ) ;
	color: #ffffff ;
}

.contents {
	background-color: rgb( 210 , 210 , 210 , 0.6 ) ;
	padding: 10px 10px 10px 10px;
}

/* ------------------------------------ */

.wrapper {
	margin: 0 auto 0 auto;
//	max-width: 960px;
}

/* ------------------------------------ */

#myaos {
//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;

	width: 80%;
	height: 80vh;

//	height: 50vh;
//	width: 100%; /* 幅いっぱいを指定 */

//    max-width: 1000px;
	margin: 0 auto;
//    display: grid;
//    gap: 2rem;
//    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

#myimage {
	width: 100%;
	height: 80vh;
	object-fit: cover;
}

/* ------------------------------------ */

.backy {
//	background-image: radial-gradient(#ffffcc,#ffff00 );
	background-image: linear-gradient( 90deg , #ffff00 , #ffffcc ) ;
}

.boxshadow {
	box-shadow: 2px 2px 8px #666;
}

/* ------------------------------------ */
#aisatsu {
	visibility:hidden;

	position: fixed; /* ウィンドウを基準に画面に固定 */
	top: 0; /* 上下の固定位置を上から0pxにする */
	left: 0; /* 左右の固定位置を左から0pxにする */

	height: 100vh;
	width: 100%; /* 幅いっぱいを指定 */
	
	background-image: radial-gradient(#c5e5ee,#238ccc );

	z-index: 50 ;
}

#aisatsu2 {
	max-width: 40vw ;
	margin: 50px auto 0 auto;
}

/* ------------------------------------ */

#win {
	background-attachment: fixed;
	background-size: cover;
	height: 100vh;
//	width: 100vh;
}

#mbk {
	width: 100%; /* 幅いっぱいを指定 */
	background-attachment: fixed;
	background-size: cover;
}

#mbk1 {
	width: 100%; /* 幅いっぱいを指定 */
//background-attachment: fixed;
	background-color: rgb( 255 , 255 , 255 , 0 ) ;
//	padding: 10px 10px 10px 10px; /* ヘッダーに上下左右それぞれ余白を指定 */
}

#mbk2 {
//	width: 49%;
	background-color: rgb( 255 , 255 , 255 , 0.9 ) ;
	padding: 10px 10px 10px 10px; /* ヘッダーに上下左右それぞれ余白を指定 */
//	margin: 5px 5px 5px 5px;

	width: 100%; 
	margin: 0 auto 0 auto;

//    	box-shadow: 4px 4px 16px #666;
//    	box-shadow: 2px 2px 8px #777;
	box-shadow: 8px 8px 32px #222;

//	border-style: solid; 
	border-width: 0px 0px 0px 0px ;
//	border-color: blue;
	border-radius: 20px; /* 半径が8pxの角丸 */

}

/* ------------------------------------ */

#back1 {
//	background-image: url(../images/keyvisual.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100vh;
}

#back2 {
	background-color: #D7EEFF;
	height: 100vh;
	text-align: center;
	padding: 100px 100px 100px 100px; /* ヘッダーに上下左右それぞれ余白を指定 */
}

#back3 {
	width: 30vw; /* 幅いっぱいを指定 */
	margin: 5px auto 5px auto;
	padding: 5px 5px 5px 5px ;
	text-align: center;
	background-color: rgb( 255 , 255 , 255 , 0.6 ) ;

//	border-style: solid; 
	border-width: 0px 0px 0px 0px ;
//	border-color: blue;
	border-radius: 20px; /* 半径が8pxの角丸 */
}

#back4 {
	position: fixed; /* ウィンドウを基準に画面に固定 */
	top: 0; /* 上下の固定位置を上から0pxにする */
	left: 0; /* 左右の固定位置を左から0pxにする */

//	top:30vh;
	left:35vw;

	width: 30vw; /* 幅いっぱいを指定 */
	margin: 5px auto 5px auto;
	padding: 5px 5px 5px 5px ;
	text-align: center;
	background-color: rgb( 255 , 255 , 255 , 0.6 ) ;

//	border-style: solid; 
	border-width: 0px 0px 0px 0px ;
//	border-color: blue;
	border-radius: 20px; /* 半径が8pxの角丸 */
}

/* ------------------------------------ */

#canvas {
	width: 1200px; /* 幅いっぱいを指定 */
	height: 800px;
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto 0 auto;

	display: none;
}

#bbbb {
	text-align: center;
	padding: 0px 0px 0px 0px; /* ヘッダーに上下左右それぞれ余白を指定 */
	display: flex;
	flex-direction: column;
	justify-content: center;

	height: 100vh;

//	background-image: url(../images/keyvisual.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100vh;
}

.bk1 {
	width: 1200px; /* 幅いっぱいを指定 */
	height: 800px;
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto 0 auto;


//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;
	background-size: cover;
}

.bk2 {
	width: 200px; /* 幅いっぱいを指定 */
	height: 200px;
//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;
	background-color: rgb( 0 , 255 , 255 , 1 ) ;
}

/* ------------------------------------ */

.youtubefull {
    position: absolute;
    top: 0;

    width: 100vw;
    height: 100vh;

    z-index: 2;
}

/* ------------------------------------ */

.iconfish {
	position:  absolute ;

	width: 10vw;
	height: auto;

	z-index: 2 ;
}

/* ------------------------------------ */

#ccc {
	position: absolute ;
	top: 0;
	left: 0;

	width: 100vw;
	height: 100vh;

	z-index: 100 ;
}

#cc {
	position: absolute ;
	top: 0;
	left: 0;

	width: 100vw;
	height: 100vh;

	background-image:radial-gradient( #c5e5ee , #238ccc ) ;
	background-size: cover;

	z-index: 1 ;
}

#ccc2 {	
	position:  absolute ;
	top: 0;
	left: 35vw; /* 幅いっぱいを指定 */

	width: 30vw; /* 幅いっぱいを指定 */
	margin: 5px auto 5px auto;
	padding: 5px 5px 5px 5px ;
	text-align: center;

	background-color: rgb( 255 , 255 , 255 , 0.6 ) ;

//	border-style: solid; 
	border-width: 0px 0px 0px 0px ;
//	border-color: blue;
	border-radius: 20px; /* 半径が8pxの角丸 */

	z-index: 5 ;
}

#cc1 {
	position:  absolute ;

	top: 20vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 11 ;
}

#cc2 {
	position:  absolute ;

	top: 30vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 12 ;
}

#cc3 {
	position:  absolute ;

	top: 40vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 13 ;
}

#cc4 {
	position:  absolute ;

	top: 50vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 14 ;
}

#cc5 {
	position:  absolute ;

	top: 60vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 15 ;
}

#cc6 {
	position:  absolute ;

	top: 70vh;
	left: 0;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 16 ;
}

#cc7 {
	position:  absolute ;

	top: 0;
	left: 20vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 17 ;
}

#cc8 {
	position:  absolute ;

	top: 0;
	left: 30vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 18 ;
}

#cc9 {
	position:  absolute ;

	top: 0;
	left: 40vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 19 ;
}

#cc10 {
	position:  absolute ;

	top: 0;
	left: 50vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 20 ;
}

#cc11 {
	position:  absolute ;

	top: 0;
	left: 60vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 21 ;
}

#cc12 {
	position:  absolute ;

	top: 0;
	left: 70vw ;

	width: 5vw ;
	height: 5vh;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;

	z-index: 22 ;
}

/* ------------------------------------ */

main {
	padding: 46px 0% 3000px;
	max-width: 960px; 
	margin: 0 auto 0 auto;
//	display: flex;
//	justify-content: space-between;
}

#main2 {
	display: flex;
}

/* ------------------------------------ */

h2 {
	color: #3f5170;
	font-size: 22px;
	border-bottom: 3px dotted #3f5170;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}



p {
	line-height: 1.6;
//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;
//margin: 0 0 0 0;
}





a:link {
	color: #d25833;
}
a:visited {
	color: #d25833;
}
a:hover {
	color: #f3937a;
}
a:active {
	color: #ff6a3b;
}

img {
	max-width: 100%;
	height: auto;
//line-height: 0;

//	border-style: solid; 
//	border-width: 1px 1px 1px 1px;
//	border-color: red;
margin: 0 0 0 0;
//	margin: 0px;
}

/* すべてのページに適用 - ヘッダー - */

/* ------------------------------------ */

#modes {
	display: none;
}

#moded {
//	margin-top: 20px;
}

#modeline {
	margin-top: 2px;
	margin-bottom: 4px;

	border-bottom: 2px dotted #3f5170;
}

.boxnone {
	display: none;
}

/* ------------------------------------ */

.nav li {
	display: inline;
	list-style-type: none;
//	padding-right: 30px;
}

.nav ul {
	margin: 0 0 0 0;
//	padding: 20px 10px 15px 20px;
//	background-image: url(../images/menu-bg.png);
//	background-repeat: repeat-x;

//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;
	text-align: center;
}

.nav a {
	border-style: solid; 
	border-width: 2px 2px 2px 2px;
	border-color: blue;
	border-radius: 8px; /* 半径が8pxの角丸 */
	padding: 1px 2px 1px 2px; /* ヘッダーに上下左右それぞれ余白を指定 */
}

.nav a:link {
	color: #3c454d;
	text-decoration: none;
}

.nav a:visited {
	color: #3c454d;
	text-decoration: none;
}

.nav a:hover {
	text-decoration: none;
	background-image: linear-gradient( 90deg , #402c86 , #20aad8 ) ;
	color: #ffffff ;
}

.nav a:active {
	color: #5a9bc0;
	text-decoration: none;
}

/* ------------------------------------ */

#button1 { background-color: #D7EEFF ; }
#button1:link { }
#button1:visited { }
#button1:hover{ background-color: #ffffff !important ; }
#button1:active { }

#button2 { background-color: #D7EEFF ; }
#button2:link { }
#button2:visited { }
#button2:hover{ background-color: #ffffff !important; }
#button2:active { }

#button3 { background-color: #D7EEFF ; }
#button3:link { }
#button3:visited { }
#button3:hover{ background-color: #ffffff  !important; }
#button3:active { }

#button4 { background-color: #D7EEFF ; }
#button4:link { }
#button4:visited { }
#button4:hover{ background-color: #ffffff ; }
#button4:active { }

#button5 { background-color: #D7EEFF ; }
#button5:link { }
#button5:visited { }
#button5:hover{ background-color: #ffffff ; }
#button5:active { }

#button6 { background-color: #D7EEFF ; }
#button6:link { }
#button6:visited { }
#button6:hover{ background-color: #ffffff !important; }
#button6:active { }

#button7 { background-color: #D7EEFF ; }
#button7:link { }
#button7:visited { }
#button7:hover{ background-color: #ffffff  !important; }
#button7:active { }

#button8 { background-color: #D7EEFF ; }
#button8:link { }
#button8:visited { }
#button8:hover{ background-color: #ffffff  !important; }
#button8:active { }

#button9 { background-color: #D7EEFF ; }
#button9:link { }
#button9:visited { }
#button9:hover{ background-color: #ffffff !important; }
#button9:active { }

#button10 { background-color: #D7EEFF ; }
#button10:link { }
#button10:visited { }
#button10:hover{ background-color: #ffffff !important; }
#button10:active { }

#button20 { background-color: #D7EEFF ; }
#button20:link { }
#button20:visited { }
#button20:hover{ background-color: #ffffff !important; }
#button20:active { }

#button30 { background-color: #D7EEFF ; }
#button30:link { }
#button30:visited { }
#button30:hover{ background-color: #ffffff !important; }
#button30:active { }

/* ------------------------------------ */

.nav {
	text-align: center;
	margin: 0px 5px 5px 0px;
}

.nav2 {
	margin: 0 0 0 0;
	padding: 0px 0px 0px 0px ;

	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* ------------------------------------ */

#mbox {
	margin: 0 0 0 0;
	padding: 0px 0px 0px 0px; /* ヘッダーに上下左右それぞれ余白を指定 */
	position: fixed; /* ウィンドウを基準に画面に固定 */
	top: 44px; /* 上下の固定位置を上から0pxにする */
	left: 0; /* 左右の固定位置を左から0pxにする */

	background-color: #D7EEFF;
//	display: flex;
	z-index: 30 ;

	border-style: solid; 
	border-width: 2px 2px 2px 2px;
	border-color: blue;

	visibility:hidden;
}

#mbox li {
//	display: inline;
	list-style-type: none;
//	padding-right: 30px;
}

#mbox ul {
	margin: 0 0 0 0;
//	padding: 20px 10px 15px 20px;
//	background-image: url(../images/menu-bg.png);
//	background-repeat: repeat-x;

//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;
	text-align: center;
}

#mbox a {
	padding: 1px 2px 1px 2px;
//	padding: 2px 2px 2px 2px;

//	border-style: solid; 
//	border-width: 2px 2px 2px 2px;
//	border-color: red;
//	border-radius: 8px; /* 半径が8pxの角丸 */
}

#mbox a:link {
	color: #3c454d;
	text-decoration: none;
}

#mbox a:visited {
	color: #3c454d;
	text-decoration: none;
}

#mbox a:hover {
//	color: #7b8dac;
	text-decoration: none;
//	background-color: #ffffff;
	background-image: linear-gradient( 90deg , #402c86 , #20aad8 ) ;
	color: #ffffff ;
}

#mbox a:active {
	color: #5a9bc0;
	text-decoration: none;
}

/* ------------------------------------ */

header {
	padding: 0px 0px 0px 0px; /* ヘッダーに上下左右それぞれ余白を指定 */
	position: fixed; /* ウィンドウを基準に画面に固定 */
	top: 0; /* 上下の固定位置を上から0pxにする */
	left: 0; /* 左右の固定位置を左から0pxにする */

//	gap: 0; /* 左右の固定位置を左から0pxにする */

	width: 100%;
//	background-color: #D7EEFF;
	background-image:linear-gradient(#c5e5ee,#238ccc ) ;
	display: flex;
	z-index: 20 ;
}

#hd2 {
	padding: 0px 0px 0px 0px; /* ヘッダーに上下左右それぞれ余白を指定 */
	position: fixed; /* ウィンドウを基準に画面に固定 */
	top: 0; /* 上下の固定位置を上から0pxにする */
	left: 0; /* 左右の固定位置を左から0pxにする */

//	gap: 0; /* 左右の固定位置を左から0pxにする */

//	width: 100%;
//	background-color: #D7EEFF;
	background-image:linear-gradient(#c5e5ee,#238ccc ) ;

	display: flex;
	z-index: 30 ;
//	visibility:hidden;
}

.header {
	display: flex;
	justify-content: space-between;

//	border-style: solid; 
//	border-width: 0px 0px 2px 0px;
//	border-color: blue;

	margin: 0px 0px 0px 0px;

	width: 100%;
//	height: 46px; /* 高さを50pxに指定 */
}

.header2 {
	display: flex;
//	justify-content: space-between;

	border-style: solid; 
	border-width: 0px 0px 2px 0px;
	border-color: blue;

	margin: 0px 0px 2px 0px;

	width: 100%;
	height: 42px; /* 高さを50pxに指定 */
}

.logo {
	margin: 0px 0px 0px 0px;
	text-align: center;
}

#button9 {
	margin: 0px 0px 0px 0px;
	height: 40px;
	width: 40px;
}

#button10 {
	margin: 0px 0px 0px 0px;
	height: 40px;
	width: 40px;
}

/* ------------------------------------ */

.textbox {
//	padding: 10px 10px 10px 10px ;
	padding: 0px 10px 0px 10px ;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* すべてのページに適用 - フッター - */

footer {
//	position: fixed;
//	bottom: 0;
//	left: 0; /* 左右の固定位置を左から0pxにする */
//
//	width: 100%;
//	height: 44px; /* 高さを50pxに指定 */
//
//	background-color: #D7EEFF;
//	display: flex;
//	z-index: 60 ;
}

.footer {
	border-width: 0px 0px 0px 0px;
//	display: flex;
	padding: 0px;
	margin: 0px;
//line-height: 0;
}

#ft {
	border-style: solid; 
	border-width: 2px 0px 0px 0px;
	border-color: blue;
	margin: 2px 0px 0px 0px;

	width: 100%; /* 幅いっぱいを指定 */
	display: flex;
}

#ft2 {
	border-style: solid; 
	border-width: 2px 0px 0px 0px;
	border-color: blue;
	margin: 2px 0px 0px 0px;
}

#footer0 {
	position: fixed;
	bottom: 0;
	left: 0; /* 左右の固定位置を左から0pxにする */

	width: 100%;
	height: 44px; /* 高さを50pxに指定 */

//	background-color: #D7EEFF;
	background-image:linear-gradient( #238ccc , #c5e5ee ) ;

	display: flex;
	z-index: 60 ;
}

#footer2 {
	position: fixed;
	bottom: 0;
	left: 0; /* 左右の固定位置を左から0pxにする */

//	width: 100%;
	height: 44px; /* 高さを50pxに指定 */

//	background-color: #D7EEFF;
	background-image:linear-gradient( #238ccc , #c5e5ee ) ;

	visibility:hidden;
	z-index: 60 ;
}

/* ------------------------------------ */

#v1 {
	position: absolute;
	top: 0;
	left: 0;

	height: 100vh;
	width: 100%; /* 幅いっぱいを指定 */
	text-align: center;

//	background-image: url(../images/keyvisual.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

#v2 {
	position: absolute;
	top: 15vh;
	left: 10%;

	margin: 0 auto 0 auto;
}

#v3 {
	position: absolute;
	top: 0;
	left: 0;

	height: 100vh;
	width: 100%; /* 幅いっぱいを指定 */

	z-index: 70 ;
}

.youtube {
	width: 80vw;
	height: 80vh;
}


.movie {
	display: flex;
}

.movie2 {
	width: 560px;
	height: 315px;
}

.movie3 {
	margin: 0 20px 0 20px ;
}

/* ------------------------------------ */

/* 個別のスタイル */
/* index.html */
.keyvisual {
	margin: 5px 5px 5px 5px;
	width: 49%;
}

.news-item {
	margin: 0;
}

/* about.html */
.shop-photo {
	float: left;
	padding: 0 1em 1em 0;
}
.clear {
	clear: both;
}
/* テーブル */
.info {
	border-collapse: collapse;
}
.info th, .info td {
	padding: 8px;
	border: 1px solid #bec2c7;
	text-align: left;
}
.info th {
	background-color: #dde2ea;
	width: 90px;
	color: #3f5170;
	vertical-align: top;
}

/* menu.html */
.menu-item {
	display: flex;
	border-bottom: 1px dashed #bec2c7;
	padding: 20px 8px;
}
.menu-photo {
	margin-right: 16px;
	flex: 1 1 auto;
}
.menu-text {
	flex: 0 0 336px;
}

/* access.html */
.map {
	text-align: center;
}

/* contact.html */
form div {
	padding:12px;
	border-bottom: 1px dashed #bec2c7;
}
select {
	width: 30em;
}
input[name="subject"] {
	width:30em;
}
textarea {
	width: 30em;
	height: 6em;
}
input[type="submit"] {
	margin: 20px 0;
	width: 30em;
}

/* スマートフォン向けCSS */
@media (max-width: 767px) {
	/* 全体 - ナビゲーション */
	.wrapper {
		margin: 0 8px;
	}
	.logo {
		margin: 30px 0;
	}
	.logo img {
		width: 200px;
	}
	.nav {	
		background-color: #dfddda;
	}
	.nav li {
		display: block;
	}

	/* menu.html - 横並び解除 */
	.menu-item {
		display: block;
	}
	.menu-photo {
		margin-right: 0;
		width: 100%;
	}
	.menu-text {
		width: 100%;
	}

	/* contact.html - フォーム */
	select {
		width: 100%;
	}
	input[name="subject"] {
		width: 100%;
	}
	textarea {
		width: 100%;
	}
	input[type="submit"] {
		margin: 20px 0;
		width: 100%;
	}	
}