@charset "UTF-8";

/*
1.Reset
2.Common style
*/

/*
** 1.Reset
*/

@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
/* font-size: 100%;
font: inherit; */
/* vertical-align: baseline; */
}

body
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
footer{
	padding: 30px 0 20px;
}
body {
/* line-height: 1; */
/+font-family: YuGothic,'Yu Gothic','Yu Gothic UI','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Arial',sans-serif;*/
-webkit-text-size-adjust:100%;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
img{
  -webkit-backface-visibility: hidden;
    
}
a:link {
      text-decoration: none;
      color: inherit;
      color: initial;
}
a:visited {
      text-decoration: none;
      color: inherit;
      color: initial;
}

a:hover {
      text-decoration: none;
      color: inherit;
      color: initial;
}

a img {
      border-width: 0px;
      border-style: none;
      border-color: #fff;
      background: transparent;
}

a img, img {outline:none; margin-top: 0px;}

*:focus {
  outline: none;
}
/*
** 2.Common style
*/
html{
  min-width: 1300px;
}
.wrp{
  width: 1100px;
  margin: 0 auto;
}

.text-box{
  font-size: 20px;
  line-height: 1.7;
  font-family: 'ヒラギノ角ゴ W1 JIS2004';
}

.text-box-s{
  font-family: 'ヒラギノ角ゴ W2 JIS2004';
}

.title{
  text-align: center;
}

main{
  /*margin-top: 95px;*/
  letter-spacing: 1px;
}

main article img{
  border-radius: 40px;
}



.pankuzu{
  background-color: #f8f8f8;
  margin-top: 95px;
}

.pankuzu ul{
  width: 1100px;
  height: 16px;
  margin: 10px auto 0;
  font-size: 13px;
  font-weight: 500;
  padding: 5px 0 3px;
}

.pankuzu li{
  float: left;
}

.pankuzu li:first-child:after{
    content: '>';
    margin-right: 10px;
    margin-left: 10px;
}

@media (max-width: 599px){

  html{
    min-width: 100%;
  }
 

  .open .menu-button-wrp div{
    height:0;
  }

  .open .menu-button-wrp div:after{
    transform: rotate(-225deg);
    transition:all cubic-bezier(.13,.58,0,1.04) .5s;
    top: 0;
  }

  .open .menu-button-wrp div:before{
    transform: rotate(225deg);
    transition:all cubic-bezier(.13,.58,0,1.04) .5s;
    top: 0;
  }

  .open .lower{
    height: calc(100vh - 160px);
    transition-duration: 0.3s;
  }

  .menu-button-wrp span{
    bottom: 4px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 0.8em;
  }

 
  .pankuzu{margin-top: 64px;}
  .pankuzu ul{width :100%;}

 
@supports (position: sticky) or (position: -webkit-sticky) {

  .pankuzu{
    margin-top: 0;
  }
  main{
    margin-top: 0;
  }
}


@media (max-width: 599px){
 


@media (max-width: 599px){
 
.sp{
  display: none;
}

@media (max-width: 599px){
  main{
  }

  main article img{
    border-radius: 0px;
  }
  section{
    width: 100%;
  }
  .wrp{
    width: 100%;
  }
  .sp{
    display: block;
  }
  .pc{
    display: none !important;
  }
}






/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 800px) {
.pc { display: none !important; }
.sp { display: block !important; }

}