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

body {
	font-family: 'Shuei KakuGo Gin M', sans-serif;
	color: #112644;
}

#wrap{background-color: #CEE0F6;
background-image: -webkit-gradient(linear, 0 0, 0 0.5%, color-stop(.5, #F9F9F9), color-stop(.5, transparent), to(transparent));
-webkit-background-size: 400px;}

article {
    max-width: 831px;
    padding: 0px;
    background-color: #BFD6F3;
    border-right: solid 1px #fff;
    border-left: solid 1px #fff;
    }

#yodogawa .inner {
	letter-spacing: 0.14em;
	padding-top:30px;}



#talk_wrap, .talk_nav, #index_nav,#yodogawa {
	max-width: 830px;
	padding: 0;
	background-color: #BFD6F3;
}

#talk_body .pic img {
    width: 70%;
    margin: 0 auto;
}

.profile_detail{text-align: center;}

.txt_box{background-color:#FFF;
text-align:left;
border-radius: 20px;
width:83%;
box-shadow: 10px 10px 10px rgba(0,0,0,0.1);
border: solid 5px #6FF39C; }

.txt_box img{width:100%;}

#talk_body .txt_box {
    padding: 40px 0px 40px 0px;
}

#index_nav,
#talk_nav,
.talk_nav,
#talk_wrap,
footer {
	max-width: 830px;
	margin-left: auto;
	margin-right: auto;
}

.date{padding-bottom:60px; font-size:90%;}


#talk_nav ul, .talk_nav ul {
    padding: 20px 50px 40px 50px;

}
	
#talk_wrap {
	padding-top: 50px;
}

footer {
  padding-top: 100px;
}

img.talker_icon {
  width: 50%;
}

#index_nav, #talk_nav, .talk_nav, #information li, #information_free li {
  margin-top: 0;
  margin-bottom: 0;
}

#information li {
  width: 90%;
  max-width: 450px;
  margin:0 auto;
}

#information{background-color:#68B0DA; color: #fff;}
#information h2{font-size:180%; color:#FCEE21;}
footer .inner {background-color: transparent;}
#information li .info_img img, #information_free li .info_img img {
    width: 50%;
    max-width: 300px;
}
#information li .info_desc p, #information_free li .info_desc p {
    width: 27em;
}
#talk_wrap h2 img {
   width: 500px;
   height: auto;
   max-width: 100%;
}
#talk_wrap .talk_end, #talk_wrap .talk_end p {
  margin: 0;
}
#talk_wrap .talk_end {
  padding-top: 3em;
}
#talk_wrap .talk_end p + p {
  padding-top: 10px;
  padding-bottom: 5em;
}
footer .inner {background-color: transparent;}
#yodogawa {
  padding-top: 30px; 
  padding-bottom: 2em; 
}
#yodogawa .btn_profile {
  text-align: center;
}
#information li, #information_free li {
  padding-top: 80px;
  padding-bottom: 60px;
  background-color: #EEF3C3;
}
@media (min-width: 641px){
  #yodogawa .inner {
    text-align: center;
  }
	img.talker_icon {
    margin-top: -15px;
    margin-right: -10px;
    margin-bottom: 10px;
  }
}

@media (max-width: 906px) {
  #kv {
    margin-left: calc((906px - 100vw) / 2 * -1);
  }
}
@media (max-width: 640px){
  #information li .info_desc p, #information_free li .info_desc p {
    width: initial;
  }
  img.talker_icon {
    width: 30%;
    max-width: 80px;
    padding-top:10px;
  }
	#kv {
    margin-left: 0;
    width: 100%;
  }
  #yodogawa {
    width:100%;
    text-align: center;
  }
  #yodogawa .inner {
    width:95%;
    padding-top:0px;
  }

  .txt_box{
    border-radius: 0px;
    width:100%;
    box-shadow: unset;
    border: unset;
    border-top: solid 5px #6FF39C;
    border-bottom: solid 5px #6FF39C;
  }

  #talk_body .pic img {
    width: 70%;
    margin: 0 auto;
  }

  .txt_box p{
    width:95%;
    padding-left:2%;
  }

  #talk_body dl {
    margin: 0 1rem;
  }
  .only_tablet #talk_body dl {
    margin: 0 auto; 
  }
  #talk_body dd {
    padding: 0 0;
    letter-spacing: 0.1em;
  }
  #information li .info_desc, #information_free li .info_desc {
    letter-spacing: 0.1em;
    text-align: justify;
  }
  #yodogawa .inner {
    letter-spacing: 0em;
    text-align: justify;
  } 
  #index_nav .title .s {
    margin-bottom: -30px;
  }
  footer {
    padding-top: 40px;
  }
	#information li .info_img, #information_free li .info_img {
    margin-top: 0px;
    margin-left: 15px;
    margin-right: 15px;
  }
  #information li .info_desc, #information_free li .info_desc {
    max-width: 100%;
    margin-left: 20px;
    margin-right: 20px;
  }
  .only_tablet #information li .info_desc, .only_tablet #information_free li .info_desc {
    max-width: 480px;
    margin: 0 auto;
  }
  #information_free li {
    padding-top: 20px;
  }
  #talk_wrap h2 img, #index_nav .title img {
    width: 80%;
  }
	#information li, #information_free li {
    padding-top: 40px;
  }
  #information, #information_free {
    padding: calc(0 / 640 * 100vw) 0 0 0;
    text-align: center;
    font-size: .9rem;
  }
}
