@charset "utf-8";
html, body, .container {
  height: 100%;
}
/* Reset */
html, body, h1, p, a, div, section {
  margin: 0;
  padding: 0;
  font-size: 100%;
  font: inherit;
}
/* Basic */
body { 
  color: #0687E1;
}
a {
  color: #0895ED;
}
p {
	line-height:150%;
}
strong {
  font-weight: 700;
}
h1 img{
	max-width: 35%;
	min-width: 400px;
	height: auto;
}
h2{
	-webkit-margin-before: 10px;
	-webkit-margin-after: 20px;
}
h2 img{
	max-width: 55% !important;
	height: auto;
}
h3{
	max-width:90%;
	display: block;
  font-size: 100%;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-margin-start: 0;
  -webkit-margin-end: 0;
  margin:0 auto;
  margin-bottom:15px;
}
blockquote {
  display: block;
  max-width: 480px;
  margin: 15px auto;
  padding: 15px;
  background-color: rgba(0, 0, 0, 0.3);
  color: #e1e1e1;
  font-family: "Kotta One", serif;
  font-size: 22px;
  line-height: 28px;
}
blockquote cite {
  display: block;
  font: 18px/23px "Cantarell", sans-serif;
  font-size: 16px;
  margin-top: 16px;
  color: #cccccc;
  text-transform: uppercase;
}

/* Layout */
.navbar {
  width: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  height: 40px;
  z-index: 9999;
  /*position: fixed;*/
}
  .inner {
    position: relative;
    margin: 0 auto;
    text-align: center;
  }
.navbar a.menu_btn {
  display: inline-block;
  border: 1px solid #fff;
  font-size: 24px;
  line-height: 24px;
  border-radius: 3px;
  padding: 2px 15px;
  text-decoration: none;
  margin-top: 5px;
  position:absolute;
  right:10px;
  top:0;
  cursor:pointer;
}
/* menu */
#menu{
  display:none; /* 最初は非表示 */
  width:100%;
  position: fixed;
  z-index:999;
  top: 0px;
  left: 0px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow: 0 0 3px 0 #333;
  background-color: #fff;
  background-size: 120px 120px;
  padding:5px;
}
#menu ul{ margin:10px; list-style:none; -webkit-padding-start: 0;}
#menu ul li{
  padding: 10px 0;
  text-align: center;
  border-top: solid 1px #fff ; /* 明るい線 */
  border-bottom: solid 1px #eee; /* 暗い線 */
  }
  
#menu ul li:first-child{ border-top:none; }
#menu ul li:last-child{ border-bottom:none; }
#menu a{
  display: block;
  height: 20px;
  text-decoration:none;
  tap-highlight-color:rgba(186,151,123, 0.3)!important; /* タップした色 */
  -webkit-tap-highlight-color:rgba(186,151,123, 0.3)!important; /* タップした色 */
  }
  #menu p.close{
  display: block;
  /*
  margin:0 auto;
  width: 15px;
  height: 15px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  border-top: solid 1px #fff;
  border-left: solid 1px #fff;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  box-shadow: 1px 1px 1px #333 inset;
  -webkit-box-shadow: 1px 1px 1px #333 inset;
  */
  cursor:pointer;
  }

.container {
  display: table;
  padding-top: 20px;
  width: 100%;
  height:380px;
}
.container2 {
  display: table;
  width: 100%;
}
.container3 {
  display: table;
  width: 100%;
  text-align:center;
}
.container4 {
  display: table;
  width: 100%;
}
.content {
  display: table-cell;
  vertical-align: top;/**/
  text-align: center;
}
/* btn */
.btnbox {
  display: table;
  width: 100%;
}
.btnbox img{
	padding:10px;
	max-width: 14%;
	min-width: 160px;
	height: auto;
}

#twline iframe{
	width:520px;
	margin:0 auto;
}

/* bana */
.banabox img{
	max-width: 80%;
	height: auto;
}

/* photo */
.photo{
	background-color:#fff;
	padding-top:20px;
	padding-bottom:17px;
	margin-bottom:40px;
}
.photo img{
	max-width: 22%;
	height: auto;
}
.photo a{
	color:#fff;
}
/* Special */
.sub-title {
	margin: 50px auto;
	font-size: 18px;
	line-height: 23px;
	text-transform: uppercase;
}
.button {
	display: inline-block;
	padding: 6px 10px;
	color: #cafaea;
	border: 1px solid #cafaea;
	border-radius: 3px;
	font-weight: 700;
	line-height: normal;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
}
.button {
	display: inline-block;
	width: 100%;
	height: 43px;
	text-align: center;
	text-decoration: none;
	line-height: 37px;
	outline: none;
border-radius:2px;
-webkit-border-radius:2px;
-moz-border-radius:2px;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .2s;
	transition: all .2s;
}
.button {
	border:3px solid #ddd;
	background-color: #fff;
	color: #666;
}
.button:hover {
	/*background-color: #59b1eb;*/
	border:3px solid #666;
	background-color: #666;
	color: #fff;
}
.linkbt{
	display: inline-block;
	width: 15%;
	height: 43px;
	text-align: center;
	text-decoration: none;
	line-height: 43px;
	outline: none;
border-radius:4px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
	border:3px solid #2645A9;
	background-color: #2645A9;
	color: #fff;
	margin-right:20px;
}
.linkbt:hover {
	border:3px solid #1F3789;
	background-color: #1F3789;
	color: #fff;
}

/*common*/
.pt10{ padding-top:10px !important;}
.mb10{ margin-bottom:10px !important;}
.mb15{ margin-bottom:15px !important;}
.mb20{ margin-bottom:20px !important;}
.mb25{ margin-bottom:25px !important;}
.mb30{ margin-bottom:30px !important;}
.mb40{ margin-bottom:40px !important;}
.font14 { font-size:12px !important; }
.font20 { font-size:20px !important; }
.font21 { font-size:21px !important; }
.font22 { font-size:22px !important; }
.font23 { font-size:23px !important; }
.font24 { font-size:24px !important; }
.font25 { font-size:25px !important; }
.font26 { font-size:26px !important; }
.font27 { font-size:27px !important; }
.font28 { font-size:28px !important; }
.bold {font-weight:bold;}
.sptxt{ display:none; font-size:11px !important; max-width:90%; margin:0 auto;}

#tnews{ background-color:#2645A9; padding:8px 15px; max-width:80%; margin:0 auto; color:#fff; font-weight:bold;}
#news{ background-color:#fff; padding:15px; max-width:80%; height:140px; margin:0 auto; overflow:auto;}
#news li{ list-style-type:none; border-bottom:1px dotted #0687E1; padding:10px;}

/* Media Queries */
@media only screen and (max-width: 375px) {
  .container {
    position: relative;
    display: block;
    float: left;
    vertical-align: baseline;
    margin: 0 auto;
    padding: 80px 0 0 0;
  }
  #more-content {
    float: left;
    margin-right: 10px;
  }
  body h1 {
    font-size: 18px;
    line-height: 23px;
  } 
  .content, blockquote {
    margin: 0 auto;
    padding-top: 80px;
    vertical-align: baseline;
  }
  blockquote {
    width: 150px;
    margin: 15px auto;
    font-size: 16px;
    line-height: 21px;
    background-color: transparent;
  }
  blockquote cite {
    font-size: 14px;
    line-height: 19px;
  }
  .sub-title {
    font-size: 14px;
    line-height: 21px;
  }
  .button {
    max-width: 150px;
    margin: 0 auto;
    font-size: 15px;
    line-height: 20px;
  }
  html, body, .container {
    height: auto;
  }
  #top img{
	max-width:40%;
	height: auto;
	padding-top:8px;
  }
h1 img{
	max-width: 80%;
	height: auto;
}
.btnbox img{
	max-width: 26%;
}
}
/* Responsive Full Background Image Using CSS
 * Tutorial URL: http://sixrevisions.com/css/responsive-background-image/
*/
body {
  /* Location of the image */
  background-image: url(/special/kisstabi2/img/bg01.jpg);
  /* Image is centered vertically and horizontally at all times */
  background-position: center center;
  /* Image doesn't repeat */
  background-repeat: no-repeat;
  /* Makes the image fixed in the viewport so that it doesn't move when 
     the content height is greater than the image height */
  background-attachment: fixed;
  /* This is what makes the background image rescale based on its container's size */
  background-size: cover;
  /* Pick a solid background color that will be displayed while the background image is loading */
  background-color:#fff;
  /* SHORTHAND CSS NOTATION
   * background: url(background-photo.jpg) center center cover no-repeat fixed;
   */
}
#timer{ font-family: 'Roboto', sans-serif; font-size:50px;}
.yyc-day-text{ font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W6','Meiryo UI','メイリオ', sans-serif; font-size:36px;}

/* For mobile devices */
@media only screen and (max-width: 767px) {
  body {
    /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
    background-image: url(/special/kisstabi2/img/bg01s.jpg);
  }
	#timer{ font-family: 'Roboto', sans-serif; font-size:36px;}
	.container {
		display: table;
		padding-top: 20px;
		width: 100%;
		height:200px;
	}
	.sptxt{ display:block;}
h1 img{
	max-width: 60%;
	height: auto;
}
.btnbox img{
	max-width: 22%;
}
.linkbt{
	width: 30%;
}
	}
	
	
/*==========================================================================
 imotonowifi fix top
 ========================================================================== */
main .split { display: inline-block; }
* { box-sizing: content-box; }
body { letter-spacing: 0; }
main {
  padding-bottom: 0;
  background: transparent;
}
main .container {
  margin-bottom: 1.4% !important;
  padding-top: 1.6%
}
main h1 {
  margin-bottom: 0.35%;
  padding: 0;
  background-color: transparent;
}
#menu ul { margin-top: 0; }
#menu li:nth-of-type(1) {
  height: 40px;
  padding: 0;
}
#menu li:nth-of-type(1) a { height: auto; }
#menu li:not(:nth-of-type(1)) a { padding: 4px 0; }
main .container4 p { text-align: left; }
main #menu li,
main .container4 li { display: block; }
main span.date { color: #0895ED; }
main .content {
  padding: 0;
  vertical-align: middle;
}
.resp-sharing-button__link {
  display: inline-block;
  margin: 0.5em;
  width: 178px;
}
.resp-sharing-button {
  display: block;
  border-radius: 5px;
  border-width: 1px;
  border-style: solid;
  transition: background-color 125ms ease-out, border-color 125ms ease-out, opacity 250ms ease-out;
  margin: 0;
  padding: 0.5em 0.75em;
  font-family: 'Source Sans Pro', sans-serif;
  text-align: left;
}
.resp-sharing-button--facebook {
  background-color: #3b5998;
  border-color: #3b5998;
}
.resp-sharing-button--twitter {
  background-color: #55acee;
  border-color: #55acee;
}
.resp-sharing-button--google {
  background-color: #dd4b39;
  border-color: #dd4b39;
}
.resp-sharing-button__link {
  text-decoration: none;
  color: #FFF;
}
.resp-sharing-button__icon {
  position: relative;
  top: 1px;
  width: 1em;
  height: 1em;
  margin-bottom: -0.1em;
}
.resp-sharing-button--large .resp-sharing-button__icon { padding-right: 0.4em; }


@media screen and (max-width: 767px) {
  main #menu { top: 50px; }
  main .container {
    margin-bottom: 16px !important;
    padding-top: 16px;
  }
  main h1 { margin-bottom: 0.8%; }
}


@media screen and (max-width: 583px) {
  h1 img { min-width: 300px; }
  .btnbox img { min-width: 84px; }
  main #twline { padding: 0 24px; }
}


@media screen and (max-width: 479px) {
  main h1 { text-align: center; }
  h1 img { max-width: 68%; }
  main #twline {
    margin-bottom: 0 !important;
    padding: 0 17px;
  }
}


/*==========================================================================
 imotonowifi fix photo
 ========================================================================== */
main .container3.photo {
  margin-bottom: 0;
  padding-bottom: 24px;
}
main .container3.photo h2 { margin-bottom: 30px; }
main .container3.photo h3 {
  margin-bottom: 1.4%;
  color: #0687E1;
  font-size: 18px;
}
main .container3 h2+ div.mb30 { margin-bottom: 24px !important; }
main .container3 .linkbt {
  margin-right: 1.2%;
  margin-bottom: 2.4%;
  margin-left: 1.2%;
  box-sizing: border-box;
}
main .container3+ .container4 .content div.mb30 { margin-bottom: -22px !important; }
main .sptxt { color: #0687E1; }


@media screen and (max-width: 767px) {
  main .container3 h2+ div.mb30 { padding: 0 10px; }
  .linkbt {
    width: 24%;
    min-width: 134px;
  }
  main .container3 .linkbt {
    margin-right: 1.6%;
    margin-bottom: 3.2%;
    margin-left: 1.6%;
  }
}


@media screen and (max-width: 583px) {
  main .container3 .linkbt {
    margin-right: 2%;
    margin-bottom: 4%;
    margin-left: 2%;
  }
}


@media screen and (max-width: 479px) {
  main .container3 .linkbt {
    margin-right: 2.5%;
    margin-bottom: 5%;
    margin-left: 2.5%;
  }
}