@charset "UTF-8";
/* ***********************************************************
*
*    INDEX
*
* ***********************************************************
*/
/* =====================================================================
*
*    sukoyakaInner Common
*
* =================================================================== */

div#sukoyakaInner div.txt-l p,
div#sukoyakaInner div.txt-r p,
div#sukoyakaInner div.txt-long p,
div#sukoyakaInner div.txt p {
  margin: 0 0 15px 0;
line-height: 2;
}

div#sukoyakaInner .pic-r {
  float: right;
}
@media screen and (max-width: 767px) {
  div#sukoyakaInner .pic-r {
    float: none;
    text-align: center;
  }
}

div#sukoyakaInner .pic-l {
  float: left;
}
@media screen and (max-width: 767px) {
  div#sukoyakaInner .pic-l {
    float: none;
    text-align: center;
  }
}

div#sukoyakaInner div.txt-long {
  clear: both;
  width: 100%;
  margin-top: 12px;
}

div#sukoyakaInner span.ref {
  margin: 0px;
  font-size: 10px;
  letter-spacing: 1.2px;
}

div#sukoyakaInner span.ref a {
  color: #000;
}

div#sukoyakaInner span.ref a:hover {
  text-decoration: underline;
}

.none{
	display:none;
	
}

/* =====================================================================
*
*    Iroha Layout
*
* =================================================================== */
div#irohaMain {
  width: 715px;
  padding: 0 0 20px 0;
}
@media screen and (max-width: 767px) {
  div#irohaMain {
    width: auto;
  }
}

div#irohaMain .section {
  width: 715px;
  margin-bottom: 40px;
}

div#irohaMain .section a {
  color: #299476;
  text-decoration: underline;
}
div#irohaMain .section a:hover {
  color: #66CC99;
}
div#irohaMain .section a:active {
  color: #66CC99;
}

div#irohaMain .section.nmb {
  margin-bottom: 0px;
}
@media screen and (max-width: 767px) {
	div#irohaMain .section {
		width: auto;
		margin-bottom: 60px;
	}
	div#irohaMain .section.smt-mb {
		margin-bottom: 60px;
	}
}

div#irohaMain .section h2 {
  margin-bottom: 16px;
}

div#irohaMain .section p.mt {
  margin-top: 36px;
}

div#irohaMain .txt-r {
  float: right;
  width: 350px;
}
@media screen and (max-width: 767px) {
  div#irohaMain .txt-r {
    float: none;
    width: auto;
  }
}

div#irohaMain .txt-l {
  float: left;
  width: 350px;
}
@media screen and (max-width: 767px) {
  div#irohaMain .txt-l {
    float: none;
    width: auto;
    padding: 0;
  }
   div#irohaMain .txt-r {
    float: none;
    width: auto;
    padding: 0;
  }
  div#irohaMain .txt-l p.ttl-img {
	width: 100%;
}

}

div#irohaMain .txt-l p.ttl-img {
	width: 350px;
}


/* -- section 01 -- */
div#irohaMain .illust01 {
	width: 266px;
	padding: 0 24px 0 0;
	float: left;
}
@media screen and (max-width: 767px) {
  div#irohaMain .illust01 {
  	width: 70%;
  	margin: 0 auto;
    text-align: center;
    float: none;
  }
}

/* -- section comic01 -- */
div#irohaMain .comic01 {
	width: 715px;
  	margin: 0 auto;
	padding:0;
}
div#irohaMain .comic02 {
	width: 517px;
  	margin: 0 auto;
	padding:0;
}

@media screen and (max-width: 767px) {
  div#irohaMain .comic01 ,div#irohaMain .comic02 {
  	width: 100%;
  	margin: 0 auto;
	padding:0;
    text-align: center;
    float: none;
  }
}


/* -- section 02 -- */
div#irohaMain .illust02 {
  width: 330px;
  margin: 0 auto;
  line-height: 0;
  float: right;
}
div#irohaMain .illust02_d {
  width: 619px;
  margin: 0 auto;
  line-height: 0;
}
div#irohaMain .illust03 {
  width: 230px;
  margin: 0 auto;
  line-height: 0;
  float: right;
}

@media screen and (max-width: 767px) {
  div#irohaMain .illust02, div#irohaMain .illust03 {
  	width: auto;
    float: none;
    text-align: center;
  }

  div#irohaMain .illust02 img {
    display: block;
   /* margin: 0 auto 10px;*/
  }
  div#irohaMain .illust03 img {
    display: block;
   /* margin: 0 auto 10px;*/
  }
}
ol.section2-img-list {
	width: 100%;
	margin: 0;
	padding: 0;
}
ol.section2-img-list li {
	width: 236px;
	list-style: none;
	float: left;
}
@media screen and (max-width: 767px) {
	ol.section2-img-list li {
		width: 70%;
		margin: 20px auto;
		float: none;
	}
}

div#irohaMain div.section02 {
	width: 619px;
	margin: 0 auto;
	padding: 0 0 38px 0;
	background: #F2F9E6;
}
div#irohaMain div.section02 p.ttl {
	width: 565px;
	margin: 0 auto;
	padding: 0 0 3px 0;
	font-size: 135%;
	color: #00AB94;
	border-bottom: 1px solid #CCC;
}
div#irohaMain div.section02 p.ttl.mddl {
	padding: 18px 0 3px 0;
}
div#irohaMain div.section02 p.lst {
	width: 565px;
	margin: 0 auto;
	padding: 7px 0 5px 0;
	font-size: 105%;
	border-bottom: 1px solid #CCC;
}
div#irohaMain div.section02 p {
	width: 565px;
	margin: 0 auto;
	padding: 12px 0 0 0;
}
@media screen and (max-width: 767px) {
  div#irohaMain div.section02 {
    width: auto;
  }
  div#irohaMain div.section02 p.ttl {
  	width: auto;
  	margin: 0 24px;
  }
  div#irohaMain div.section02 p.ttl.mddl {
  	width: auto;
  	margin: 0 24px;
  }
  div#irohaMain div.section02 p.lst {
  	width: auto;
  	margin: 0 24px;
  }
  div#irohaMain div.section02 p {
	width: auto;
  	margin: 0 24px;
  }
}

/* -- section 03 -- */
div#irohaMain .illust03 {
	width: 230px;
	padding: 0;
	float: right;
}
@media screen and (max-width: 767px) {
  div#irohaMain .illust03 {
  	width: 70%;
    text-align: center;
  }
}

.section3 {
	width: 350px !important;
}
.section3r330 {
	width: 330px !important;
	float: right;
}

.section3r {
	width: 350px !important;
	float: right;
}

.section3 p {
	margin: 0 !important;
	padding: 0 24px;
	color: #00AB94;
	background:#FFF3F6;
}

.section3r330 p {
	margin: 0 !important;
	padding: 0 24px;
	color: #00AB94;
	background:#FFF3F6;
}


.section3 img {
	vertical-align: bottom;
}

.section3r330 img {
	vertical-align: bottom;
}


@media screen and (max-width: 767px) {
	.section3, .section3r {
		width: 100% !important;
		margin: 0 auto;
		float: none;
	}
	.section3 img {
		width: 100% !important;
	}
	.section3r330, .section3r {
		width: 100% !important;
		margin: 0 auto;
		float: none;
	}
	.section3r330 img {
		width: 100% !important;
	}
}

/*  reference
-----------------------------------------------------------------*/
div.reference {
	background: inherit;
}

div.reference p.reference-title {
	float: left;
	width: 6ex;
}
div.reference p.reference-contents {
	width:auto; overflow:hidden;
}

/*  kaisetuu
-----------------------------------------------------------------*/
.kaisetsu {
	background: #FFF !important;
}
.kaisetsu .kaisetsu_title {
	line-height: 0;
}
.kaisetsu .kaisetsu_body {
	/*width: 643px;*/
	margin: 0 auto;
	padding: 0 10px 0px 30px;
	background: #dcf4e6;
}
.kaisetsu .kaisetsu_body .kaisetsu_body_inner {
	margin: 20px 0 0 0;
}
.kaisetsu .kaisetsu_body .kaisetsu_body_inner .txt-l {
	width: 386px;
	margin: 0 32px 0 0;
	float: left;
}
.kaisetsu .kaisetsu_body .kaisetsu_body_inner .pict-r {
	width: 251px;
	float: right;
}
.kaisetsu .kaisetsu-btm {
  line-height: 0;
}
.kaisetsu a {
	text-decoration: underline !important;
}
@media screen and (max-width: 767px) {
	.kaisetsu .kaisetsu_body {
		width: auto;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner {
		width: 100%;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .txt-l {
		width: 50%;
		margin: 0 5% 0 0;
		float: left;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .pict-r {
		width: 45%;
		float: right;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .pict-r img {
		width: 90%;
		margin: 0 5% 0 0;
	}
}
@media screen and (max-width: 480px) {
	.kaisetsu .kaisetsu_body {
		padding: 0 5% 7% 5%;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .txt-l {
		width: auto;
		margin: 0;
		float: none;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .pict-r {
		width: auto;
		float: none;
		text-align: center;
	}
	.kaisetsu .kaisetsu_body p.title {
		padding-top: 20px;
	}
}


/*  column
-----------------------------------------------------------------*/

div.column {
  width: 715px;
  margin: 0px 0 48px 0;
  background-image: none !important;
}

.column a {
  color: #299476;
  text-decoration: underline;
}

.column .column_title {
	line-height: 0;
}
.column .column_inner {
	background: #d8f4fd;
	padding: 0 36px 0 36px;
}
.column .column_inner .column__body {
	margin: 15px 0 0 0;
}
@media screen and (max-width: 767px) {
  .column .column_inner {
    padding: 20px 40px 0;
  }
}
@media screen and (max-width: 480px) {
  .column .column_inner {
    padding: 20px 5% 0 5%;
  }
}






.column .column_inner .txt-l {
	width: 435px;
	margin: 0 24px 0 0;
	float: left;
}
.column .column_inner .pict-r {
	width: 184px;
	float: right;
}

@media screen and (max-width: 767px) {
  div.column {
  	width: auto;
  }
  .column .column_inner .txt-l {
  	width: 50%;
  	margin: 0 5% 0 0;
  	float: left;
  }
  .column .column_inner .pict-r {
	width: 40%;
	float: right;
	}
}

@media screen and (max-width: 480px) {
	.column {
		background: none;
		border: none !important;
		background-color: #fff !important;
	}
	.column .column_inner .txt-l {
  	width:auto;
  	margin: 0;
  	float: none;
  }
  .column .column_inner .pict-r {
	width: auto;
	float: none;
	text-align: center;
	}
}

@media screen and (max-width: 767px) {
  div#column .pic-r {
    display: none;
  }
}

div#column h3 {
  padding-top: 20px;
}

div#column div.txt-l {
  float: left;
  width: 380px;
  padding-top: 24px;
}
@media screen and (max-width: 767px) {
  div#column div.txt-l {
    float: none;
    width: auto;
  }
}

div#column p.fig {
  padding-top: 25px;
}

/* responsive image*/
@media screen and (max-width: 480px) {
  #illust_3--res {
    float: right;
    margin: 10px;
  }
  img.scale-img {
	  width: 90%;
  }
}

@media screen and (max-width: 767px) {
  p#pageTop {
    margin-top: -20px;
  }
}


p.credit {
	font-size:118%;
	text-align:right;
	color:#00AB94;
}

@media screen and (max-width: 480px) {
	p.credit {
		font-size:105%;
	
	}
}


/*  カラム幅調整用
-----------------------------------------------------------------*/
div#irohaMain .w-350 {
	width: 350px;
}
div#irohaMain .w-450 {
	width: 450px;
}
div#irohaMain .w-470 {
	width: 470px;
}
div#irohaMain .w-340, .kaisetsu .kaisetsu_body .kaisetsu_body_inner .w-340  {
	width: 340px;
}
div#irohaMain .w-386  {
	width: 386px;
}
div#irohaMain .w-330 {
	width: 330px;
}
div#irohaMain .w-240 {
	width: 240px;
}
div#irohaMain .w-200 {
	width: 200px;
}
div#irohaMain .m-auto {
	margin: 0 auto;
}

@media screen and (max-width: 767px) {
	div#irohaMain .w-350 {
		width: auto;
	}
	div#irohaMain .w-450 {
		width: auto;
	}
	div#irohaMain .w-470 {
		width: auto;
	}
	div#irohaMain .w-340 {
		width: auto;
	}
	div#irohaMain .w-386 {
		width: auto;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .w-340 {
		width: 50%;
	}
	div#irohaMain .w-330 {
		width: auto;
	}
	div#irohaMain .w-240 {
			width: auto;
	}
	div#irohaMain .w-200 {
			width: auto;
	}
}
@media screen and (max-width: 480px) {
	div#irohaMain .w-350 {
		width: auto;
	}
	div#irohaMain .w-450 {
		width: auto;
	}
	div#irohaMain .w-470 {
		width: auto;
	}
	div#irohaMain .w-340 {
		width: auto;
	}
	div#irohaMain .w-386 {
		width: auto;
	}
	.kaisetsu .kaisetsu_body .kaisetsu_body_inner .w-340 {
		width: auto;
	}
	div#irohaMain .w-330 {
		width: auto;
	}
	div#irohaMain .w-240 {
			width: auto;
	}
	div#irohaMain .w-200 {
			width: auto;
	}

}