@charset "UTF-8";
/*---全ページ共通---*/
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  margin: 0;
  padding: 0;
}

header,#slider,#top_image,main,footer {
  width: 900px;
  margin: 0 auto;
}

h1 {
  height: 70px;
  margin: 0;
  font-size: 2.8rem;
  font-family: "游明朝","ヒラギノ明朝",serif;
  line-height: 30px;
  text-align: center;
}

h1 span {
  font-size: 1.4rem;
}

h2 {
  height: 100px;
  margin: 0;
  font-size: 2.4rem;
  font-family: "游明朝","ヒラギノ明朝",serif;
  line-height: 100px;
  text-align: center;
}

h3 {
  font-family: "游ゴシック","ヒラギノ角ゴProN",sans-serif;
  text-align: center;
}

header {
  height: 70px;
  position: fixed;
  top: 0;
  left: 50%;
  margin-left: -450px;
  background-color: #ffffff;
  z-index: 5;
}

#sp_menu {
  margin: 0;
  position: absolute;
  top: 20px;
  right: 20px;
  width: 60px;
  height: 50px;
  cursor: pointer;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  z-index: 10;

}

#sp_menu span {
  position: absolute;
  width: 50px;
  height: 3px;
  background: #999999;
  border-radius: 15px;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

#sp_menu span:first-child {
  top: 0px;
  right: 0px;
}

#sp_menu span:nth-child(2) {
  top: 14px;
  right: 0px;
}

#sp_menu span:last-child {
  top: 28px;
  right: 0px;
}

#sp_menu.open {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg)
}

#sp_menu.open span:first-child {
  width: 45px;
  top: 30px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#sp_menu.open span:nth-child(2) {
  width: 45px;
  top: 30px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#sp_menu.open span:last-child {
  width: 45px;
  top: 30px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

nav {
  position: fixed;
  top: 0;
  right: -260px;
  width: 260px;
  height: 300px;
  padding-top: 70px;
  background-color: #ffffff;
  z-index: 7
}

nav ul {
  margin: 0;
  padding: 0;
}

nav ul li {
  width: 260px;
  height: 60px;
  padding-left: 2rem;
  list-style-type: none;
  border-top: 1px dotted #ffffff;
}

nav ul li a {
  text-decoration: none;
  color: #ffffff;
  font-size: 1.4rem;
  line-height: 60px;
}

nav ul li#menu01 {
  background-color: #00AF91;
}

nav ul li#menu02 {
  background-color: #16C79A;
}

nav ul li#menu02 a {
  line-height: 30px;
}

nav ul li#menu03 {
  background-color: #01C5C4;
}

nav ul li#menu04 {
  background-color: #E6DD3B;
}

nav ul li#menu05 {
  background-color: #EF8D32;
}

nav ul li#menu01:hover, nav ul li#menu02:hover, nav ul li#menu03:hover,
nav ul li#menu04:hover, nav ul li#menu05:hover {
  background-color: #999999;
  transition: all 0.3s;
}

#top_image {
  width: 900px;
  height: 600px;
  position: fixed;
  top: 70px;
  left: 50%;
  margin-left: -450px;
  z-index: 1;
}

main {
  font-family: "游ゴシック","ヒラギノ角ゴProN",sans-serif;
  font-size: 1.6rem;
}

footer {
  font-family: "游ゴシック","ヒラギノ角ゴProN",sans-serif;
}

#copy {
  margin: 0;
  text-align: center;
}

/*---top.html---*/
/*-----------ここからスライドショー部分-------------*/
#slider {
  width: 900px;
  margin: 0 auto;
  position: relative;
  top: 70px;
  z-index: 3;
}

#slider ul {
  list-style: none;
}

#slider img {
  vertical-align: bottom;
}

.slider_image {
  position: relative;
  width: 900px;
  height: 600px;
  margin: 0 0 8px 0;
  padding: 0;
}

.slider_image li {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.slider_image li.show {
  opacity: 1;
  -webkit-transition: all 1.2s;
  transition: all 1.2s;
}

.slider_dotnav {
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 0;
}

.slider_dotnav li {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 0 3px;
  border-radius: 15px;
  cursor: pointer;
  background: #f2f2f2;
  -webkit-transition: all 1.2s;
  transition: all 1.2s;
}

.slider_dotnav li:hover,
.slider_dotnav li.current {
  background: #999999;
}

/*-----------ここまでスライドショー部分-----------*/
body#top main {
 position: relative;
 top: 70px;
}

body#top footer {
  position: relative;
  top: 100px;
  z-index: 3;
}

body#top h2:before {
  content: url(../images/top_hp.gif);
}

body#top div.wrapper {
  display: flex;
  flex-wrap: wrap;
}

body#top div.contents, body#top div.contents img {
  width: 450px;
  height: 270px;
}

body#top div.contents:nth-child(2) p:first-child {
 margin: 0;
 padding: 50px 2rem 10px 2rem;
 line-height: 3rem;
}

body#top div.contents:nth-child(2) p:last-child {
 margin: 0;
 padding: 10px 2rem 40px 2rem;
 line-height: 3rem;
}

body#top div.contents:nth-child(3) {
  display: none;
}

body#top div.contents:nth-child(4) p {
 margin: 0;
 padding: 90px 2rem 90px 2rem;
 line-height: 3rem;
}

body#top div.contents:nth-child(2),body#top div.contents:nth-child(4) {
  background-color: #F7F7F7;
}

/*---tokuteisho.html---*/
body#tokuteisho main {
 position: relative;
 top: 670px;
 background-color: #ffffff;
 opacity: 0.9;
 z-index: 3;
}

body#tokuteisho footer {
  position: relative;
  top: 700px;
  z-index: 3;
}

 body#tokuteisho a:hover {
   color: #E6DD3B;
 }

body#tokuteisho h2:before {
  content: url(../images/tokuteisho_hp.gif);
}

body#tokuteisho h3 {
  color: #00AF91;
  font-size: 2.4rem;
  margin: 2rem 0 1.6rem 0;
}

body#tokuteisho main a {
  color: #00AF91;
}

body#tokuteisho main {
  text-align: center;
}

#sp_ordernav {
  display: none;
}

body#tokuteisho dl,body#tokuteisho dt,body#tokuteisho dd {
  margin: 0;
}

body#tokuteisho dt {
  font-size: 2rem;
  margin-top: 2.4rem;
}

body#tokuteisho div.wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

body#tokuteisho div.contents {
  width: 420px;
  height: 400px;
  margin-top: 30px;
  border: 1px solid #00AF91;
  border-radius: 30px;
}

body#tokuteisho div.contents p {
  margin: 0 2rem;
  text-align: left;
}

body#tokuteisho div.contents p.space {
  text-indent: -1.6rem;
  padding-left: 1.6rem;
}

body#tokuteisho div.email {
  padding-top: 80px;
}

body#tokuteisho div.email p {
  font-size: 2rem;
  text-align: center;
}

body#tokuteisho div.email p.space {
  font-size: 1.6rem;
  text-align: left;
}

body#tokuteisho table {
  border-collapse: collapse;
  margin: 40px auto 0 auto;
}

body#tokuteisho table th, body#tokuteisho table td {
  border: solid 2px #00AF91;
}

body#tokuteisho table th {
  width: 180px;
  font-weight: normal;
}

body#tokuteisho table td {
  width: 80px;
}

/*---kaitori.html---*/
body#kaitori main {
 position: relative;
 top: 670px;
 background-color: #ffffff;
 opacity: 0.9;
 z-index: 3;
}

body#kaitori footer {
  position: relative;
  top: 700px;
  z-index: 3;
}

body#kaitori h2:before {
  content: url(../images/kaitori_hp.gif);
}

body#kaitori h3 {
  margin: 54px 0 16px 0;
  color: #01C5C4;
}

body#kaitori h4 {
  margin: -16px 0 16px 0;
  text-align: center;
  color: #01C5C4;
}

body#kaitori p {
  margin: 0;
}

body#kaitori main a {
  color: #01C5C4;
}

body#kaitori main a:hover {
  color: #E6DD3B;
}

#kaitoribunya, #shucchohani, #chuiten {
  padding: 0 1.6rem;
}

body#kaitori main ul {
  margin: 0;
  padding: 0;
}

body#kaitori ul#kaitori_nav {
  margin: 2rem auto 0 auto;
  text-align: center;
}

body#kaitori main ul li {
  list-style-type: none;
  text-indent: -1.6rem;
  padding-left: 1.6rem;
}

body#kaitori ul#kaitori_info li:before {
  content: url(../images/kaitori_h3.gif);
}

body#kaitori ul#kaitori_nav li {
  height: 36px;
}

div#kaitoribunya ul li {
  margin-top: 16px;
}

div#kaitoribunya ul li:before {
  content: url(../images/bunya_h3.gif);
}

div#shucchohani h4:before, div#shucchohani h4::after {
  content: url(../images/shuccho_h3.gif);
}

div#chuiten ul li {
  margin-bottom: 16px;
}

div#chuiten ul li:before {
  content: url(../images/chuiten_h3.gif);
}

div.contents02_photo {
  display: flex;
  flex-wrap: wrap;
}

div.contents02_photo img {
  width: 240px;
  height: 160px;
}

body#kaitori main span {
  color: #EF8D32;
}

body#kaitori main ul li.nigate span {
  color: #01C5C4;
}

/*---koshobu.html---*/
body#koshobu main {
 position: relative;
 top: 670px;
 background-color: #ffffff;
 z-index: 3;
}

body#koshobu footer {
  position: relative;
  top: 700px;
  z-index: 3;
}

body#koshobu h2:before {
  content: url(../images/koshobu_hp.gif);
}

body#koshobu main p {
  margin: 0 0 1.1rem 0;
  text-align: center;
}

body#koshobu div.wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

body#koshobu div.wrapper ul {
  margin: 0;
  padding: 1.4rem 1.4rem 0 2.8rem;
}

body#koshobu div.wrapper ul li {
  font-size: 1.4rem;
}

body#koshobu div.contents {
  display: flex;
}

body#koshobu div.contents:nth-child(odd) {
  margin: 0 16px 20px 34px;
}

body#koshobu div.contents:nth-child(even) {
  margin: 0 34px 20px 16px;
}

body#koshobu div.contents_img {
  width: 200px;
  height: 300px;
  margin: 0;
}

body#koshobu div.contents_info {
  width: 200px;
  height: 300px;
  margin: 0;
  background-color: #E6DD38;
}

/*---shashinbu.html---*/
body#shashinbu #top_image {
  width: 900px;
  height: 600px;
  margin-left: -450px;
  position: relative;
  top: 70px;
  z-index: 3;
}

body#shashinbu main {
 position: relative;
 top: 70px;
 z-index: 3;
}

body#shashinbu footer {
  position: relative;
  top: 100px;
  z-index: 3;
}

body#shashinbu h2:before {
  content: url(../images/shashinbu_hp.gif);
}

/*エフェクトここから*/
body#shashinbu div.photo {
  opacity: 0;
  transition: all 0.7s;
}

body#shashinbu div.scroll-in {
  opacity: 1;
}

body#shashinbu div.scroll-in:hover {
  background-color: #ffffff;
  opacity: 0.7;
  transition: all 0.1s;
}
/*エフェクトここまで*/

body#shashinbu main h3 {
  font-family: "游明朝","ヒラギノ明朝",serif;
  font-size: 2rem;
  margin: 0;
  text-align: center;
}

body#shashinbu main h3::before {
  content: url(../images/chuiten_h3.gif);
}

body#shashinbu div.wrapper {
  display: flex;
  flex-wrap: wrap;
  margin-top: 50px;
}

div.no1, div.no4, div.no5, div.no8, div.no9, div.no13, div.no16 {
  width: 250px;
  height: 375px;
}

div.no2, div.no3, div.no6, div.no7, div.no10, div.no14, div.no15 {
  width: 375px;
  height: 250px;
  padding-top: 62px;
}

div.no11, div.no12 {
  width: 375px;
  height: 250px;
}

body#shashinbu div.photo:nth-child(odd) {
  margin: 0 28px 30px 110px;
}

body#shashinbu div.photo:nth-child(even) {
  margin: 0 110px 30px 27px;
}

body#shashinbu div.photo:nth-child(11) {
  margin: 32px 25px 63px 50px;
}

body#shashinbu div.photo:nth-child(12) {
  margin: 32px 50px 63px 25px;
}