/* ------------------------------
 共通設定
------------------------------ */

@-ms-viewport {
  width: auto;
  initial-scale: 1;
}

@border-radius-base: 2px;
@border-radius-large: 3px;
@border-radius-small: 1px;

/* ------------------------------
 タグ単位でのセッティング
------------------------------ */

p {
  line-height: 150%;
  font-size: 108%;
}

body {
  background-color: #edf2c9;
  color: #111111;
  font-family: "Helvetica Neue", Helvetica, Arial, "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background-image: url(../image/background.jpg);
  background-position: center top;
  background-attachment:fixed;
  background-repeat:no-repeat;
  background-size: cover;
}

a:link {
  color: #33d
}

a:link, a:visited {
  text-decolation: underline
}

a:visited {
  color: #66e
}

a:active, a:hover {
  color: #aaf;
  text-decolation: underline
}


/* ------------------------------
 メディアクエリ分岐
------------------------------ */


/* PC */

@media screen and (min-width: 991px) {
  .pagetitle {
	max-width:550px;
    margin: 0px auto 30px auto;
    text-align: center;
  }
  .pcsize {
    max-width: 300px;
  }
  .imagesaver_parent {
    padding: 0px;
    margin-top: 0px;
  }
  .imagesaver_child img {
    width: 303px;
    height: 203px;
  }
  .imagesaver_child {
    margin: -15px auto 0px auto;
    background-image: url(../photo/cast_03.jpg);
    background-size: contain;
    background-repeat: no-repeat;
  }
  .flo_right {
    float: right;
    margin: 0px 0px 15px 15px;
    clear: both;
  }
  .flo_left {
    float: left;
    margin: 0px 15px 0px 0px;
    clear: both;
  }
}


/* Tablet */

@media screen and (max-width: 990px) and (min-width: 768px) {
  .pagetitle {
    padding: 0px;
    margin: -10px auto 20px auto;
    max-width: 68%;
  }
  .pcsize {
    max-width: 300px;
  }
  .imagesaver_parent {
    padding: 0px;
    margin-top: 0px;
  }
  .imagesaver_child img {
    width: 303px;
    height: 203px;
  }
  .imagesaver_child {
    margin: -15px auto 0px auto;
    background-image: url(../photo/cast_03.jpg);
    background-size: contain;
    background-repeat: no-repeat;
  }
  .flo_right {
    float: right;
    margin: 0px 0px 15px 15px;
    clear: both;
  }
  .flo_left {
    float: left;
    margin: 0px 15px 0px 0px;
    clear: both;
  }
}


/* Sp */

@media screen and (max-width: 767px) and (min-width: 1px) {

  .pagetitle {
    max-width: 85%;
    padding: 0px;
    margin: -20px auto 15px auto;
  }
  .midashisp {
    margin: 0px 0px 0px 0px;
  }
  .imagesaver_parent {
    padding: 0px;
    margin-top: 0px;
  }
  .imagesaver_child img {
    width: 100%;
  }
  .imagesaver_child {
    margin: 30px auto -45px auto;
    background-image: url(../photo/cast_03.jpg);
    background-size: contain;
    background-repeat: no-repeat;
  }
  .sniffersp {
    margin-bottom: -20px;
    padding-top: 10px;
  }
  .yokohyaku {
    margin-top: 0px;
  }
  .yokohyaku_inline {
    margin-top: -20px;
  }
  .flo_right {
    margin: 0px 0px 15px 0px;
  }
  .flo_left {
    margin: 0px 0px 15px 0px;
  }
}


/* ------------------------------
 トップイメージ
------------------------------ */

.yokohyaku {
  width: 100%;
}

.yokohyaku_back {
	max-height:696px;
	margin-top:-4px;
	background-image: url(../image/pc_topimage_background.jpg);
	background-position:center;
	background-repeat:repeat-x;
}

.yokohyaku_title {
	max-height:694px;
	position:relative;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.yokohyaku_lead {
	position:relative;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.hanachan_badge {
	position: absolute;
    right: 5px;
    bottom: 35px;
    max-width:16vw;
}

/* ------------------------------
 ヘッダーエリア
------------------------------ */

.hero-header {
  padding: 0px;
  margin-top: 0px;
}

@media screen and (min-width: 991px) {
  .hero-header img {
    margin-top: -20px;
    hight: 710px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 990px) and (min-width: 768px) {
  .hero-header img {
    margin-top: -20px;
    width: 595px;
    hight: 761px;
    margin-left: auto;
    margin-right: auto;
  }
}

.hero-header .container {
  margin-top: 0px;
  margin-bottom: 15px;
}

.hero-header-sp img {
  margin-top: -20px;
  margin-bottom: -10px;
}

.hero-header-kobetsu {
	height: 285px;
	width: 100vw;
	margin-bottom: 0px;
	background-color:#0F0B0E;
	background-image: url(../image/pc_kobetsuheader_back.jpg);
	background-position:center;
	background-repeat:repeat-x;
}

.hero-header-kobetsu h1 {
  width: 135px;
  padding-top:13px;
  margin: 0 auto;
}

.hero-header-kobetsu-sp {
  height: 0%;
  padding: 0px;
  margin: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  background-color: #D1E9EB;
}

.bordertop {
  border-top: 1px solid #666;
}

.borderbottom {
  border-bottom: 1px solid #666;
}


/* ------------------------------
 ナビ
------------------------------ */


/* PC 960to820 */

@media screen and (min-width: 992px) {
  nav {
    height: 90px;
    width: 100%;
    margin-top: -16px;
    background-color:#333;
  }
  nav ul {
    width: 960px;
    padding: 0px;
  }
  nav li {
    margin-top: 19px;
    margin-left: 6px;
    margin-right: 6px;
    max-width: 106px;
    list-style-type: none;
    float: left;
  }
  nav li:first-child {}
  nav li:last-child {
    margin-left: 3px;
    margin-right: 0px;
  }
  .navfooter {
    height: 90px;
    margin-top: -30px;
  }
  .navfooter li {
    margin-top: 18px;
  }
}


/* Tablet 650to570 */

@media screen and (max-width: 991px) and (min-width: 768px) {
  nav {
    height: 72px;
    width: 100%;
    margin-top:-20px;
    background-color:#333;
  }
  nav ul {
    width: 650px;
    padding: 0px;
  }
  nav li {
    margin-top: 19px;
    margin-left: 3px;
    margin-right: 3px;
    max-width: 74px;
    list-style-type: none;
    float: left;
  }
  nav li:first-child {
    margin-left: 9px;
  }
  nav li:last-child {
    margin-left: 3px;
    margin-right: 0px;
  }
  .navfooter {
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .navfooter il {
    margin-top: 0px;
  }
}


/* Sp */

@media screen and (max-width: 767px) and (min-width: 1px) {
  nav {
    margin-top: -10px;
    background-color:#333;
  }
  nav ul {
    width: 320px;
    height: 228px;
    padding-left: 10px;
    padding-top: 10px;
  }
  nav li {
    margin: 12px 4px 12px 4px;
    list-style-type: none;
    float: left;
    max-width: 90px;
  }
  .navfooter {
    height: 226px;
    margin-bottom: 0px;
  }
  .navfooter ul {
    margin-top: -8px;
  }
  .navfooter il {
    margin: 8px 4px 0px 4px;
  }
}


/* ------------------------------
 ユーティリティ
------------------------------ */

.mainclm {
  margin-top: 45px;
  margin-bottom: 0px;
}

.clearfix {
  width: 100%;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
  margin-bottom: 0px;
}

.row--nopadding {
  margin-left: 0;
  margin-right: 0;
}

.row--nopadding>[class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}

.textred {
  color: #FF0000;
}

.textblue {
  color: #0000FF;
}

.castborder {
  border-width: 1px 0 0 0;
  border-color: #999999;
  border-style: dotted;
  margin-top: 30px;
  margin-bottom: 30px;
}

.casthr {
  border-top: 1px dotted #999;
  padding-top: 15px;
}

.btn-default {
  color: #111111;
}

.btn {
  position: relative;
  display: inline-block;
  padding: 0.75em 1em;
  margin-bottom:0px;
  text-decoration: none;
  background: #FD9636;
  /*背景色*/
  border-bottom: solid 2px #D08D00;
  border-radius: 6px;
  color: #FFFFFF !important;
  font-weight: bold;
}


/* ------------------------------
 共通フッターヘッター
------------------------------ */

.nol_footerLogo {
  margin-left: 15px !important;
}

.nol_copy {
  margin-left: 15px !important;
}


/* ------------------------------
 nol_share
------------------------------ */

#share_tate {
  position: fixed;
  display: none;
}

.snsfixed {
  width: 65px;
  height: 202px;
  margin: 65px 0px 0px 0px;
  padding: 8px 8px 8px 8px;
		background: linear-gradient(#cee8dd, #fff);
		border-bottom: solid 2px #c2c2c2;
  position: fixed;
  right: 15px;
  top: 0;
  z-index: 9999;
}

#share_tate .nhksns-guide {
  display: none !important;
}

#share_tate .nhksns li {
  display: block;
  padding: 0 0 5px;
}

#share_tate .nhk-snsbtn {
  margin-bottom: 0px;
}

#share_tate .hanaremasu {
  padding: 2px 0px 0px 1px;
}

#share_yoko {
  width: 240px;
  margin-top: 0px;
  margin-bottom: 35px;
}

#share_yoko .nhksns li {
  display: inline-block;
  padding: 0 0 5px;
}

#share_yoko .nhksns img {
  border: 3px solid #DDDDDD;
}

#share_yoko .nhk-snsbtn {
  margin-bottom: 0px;
}

#share_yoko .nhksns-guide {
  display: none !important;
}

/* ------------------------------
 座布団
------------------------------ */

@media screen and (min-width: 768px) {
	.textbox_zabuton {
		background-color:#ffffff;
		padding:30px 30px 30px 30px;
		margin-bottom:30px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
	}

	.textbox_zabuton_tome {
		background-color:#ffffff;
		padding:30px 30px 30px 30px;
		margin-bottom:30px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
	}

  .textbox_zabuton_end {
    background-color:#ffffff;
    padding: 30px 30px 30px 30px;
    margin-bottom: 60px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt {
    background-color:#ffffff;
    padding: 25px 30px 30px 30px;
    margin-bottom: 30px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt_movie {
    background-color:#ffffff;
    padding: 15px 15px 0px 15px;
    margin-bottom: 0px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt_end {
    background-color:#ffffff;
    padding: 30px 30px 30px 30px;
    margin-bottom: 45px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .rds {
    border-radius: 6px;
  }
}

@media screen and (max-width: 767px) and (min-width: 1px) {
  .textbox_zabuton {
    background-color:#ffffff;
    padding: 20px 20px 20px 20px;
    margin-bottom: 20px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }

	.textbox_zabuton_tome {
		background-color:#ffffff;
    padding: 20px 20px 20px 20px;
    margin-bottom: 20px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
	}

  .textbox_zabuton_end {
    background-color:#ffffff;
    padding: 20px 20px 20px 20px;
    margin-bottom: 45px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt {
    background-color:#ffffff;
    padding: 20px 20px 20px 20px;
    margin-bottom: 20px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt_movie {
    background-color:#ffffff;
    padding: 20px 20px 0px 20px;
    margin-bottom: 0px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .textbox_zabuton_wgt_end {
    background-color:#ffffff;
    padding: 20px 20px 20px 20px;
    margin-bottom: 20px;
		background: linear-gradient(#fcfcfc, #fff);
		border-bottom: solid 2px #bcad9b;
  }
  .rds {
    border-radius: 6px;
  }
  .bbsinline {
    margin-top: -30px;
  }
}


/* ------------------------------
 見出し
------------------------------ */

.midashi {
  margin-top: 0px;
  margin-bottom: 0px;
  padding-bottom: 0px;
}

.midashiunder {
  padding-bottom: 10px;
  border-bottom: 1px dotted #666;
  margin-bottom: 15px;
}

.midashiupdate {
  margin: 0px 0px 0px 0px;
}

.midashiupdateunder {
  margin-top: 0px;
  padding-bottom: 10px;
  border-bottom: 1px dotted #666;
  margin-bottom: 15px;
}


/* ------------------------------
 フォントサイズ指定
------------------------------ */

.text077 {
  font-size: 77%;
  line-height: 160%;
}

.text085 {
  font-size: 85%;
  line-height: 160%;
}

.text093 {
  font-size: 93%;
  line-height: 160%;
}

.text100 {
  font-size: 100%;
  line-height: 160%;
  margin-bottom: 3px;
}

.text108 {
  font-size: 108%;
  line-height: 160%;
}

.text116 {
  font-size: 116%;
  line-height: 160%;
}

.text123 {
  font-size: 123.1%;
  line-height: 160%;
}

.text131 {
  font-size: 131%;
  line-height: 160%;
}

.text138 {
  font-size: 138.5%;
  line-height: 160%;
}

.text146 {
  font-size: 146.5%;
  line-height: 160%;
}

.text153 {
  font-size: 153.9%;
  line-height: 160%;
}

.text161 {
  font-size: 161.6%;
  line-height: 160%;
}

.text167 {
  font-size: 167%;
  line-height: 160%;
}

.text174 {
  font-size: 174%;
  line-height: 160%;
}

.text182 {
  font-size: 182%;
  line-height: 160%;
}

.text189 {
  font-size: 189%;
  line-height: 160%;
}

.text197 {
  font-size: 197%;
  line-height: 160%;
}

.bold {
  font-weight: bold;
}

.textred {
  color: red;
}