@charset "utf-8";

/* ----------------------------------------------------------------------
フォントファミリー
---------------------------------------------------------------------- */
.hira_font{
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    line-height: 1.6;
    color: #333;
    letter-spacing: 0.05em;
}


/* ----------------------------------------------------------------------
フォントサイズ
---------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
	.font10-12px{
		font-size: 12px ;
	}
	.font12-14px{
		font-size: 14px ;
	}
	.font14-16px{
		font-size: 16px ;
	}
	.font15-20px{
		font-size: 20px ;
	}
	.font15-18px{
		font-size: 18px ;
	}
	.font16-18px{
		font-size: 18px ;
	}
	.font16-20px{
		font-size: 20px ;
	}
	.font18-20px{
		font-size: 20px ;
	}
	.font18-25px{
		font-size: 25px ;
	}
	.font18-22px{
		font-size: 22px ;
	}
	.font20-22px{
		font-size: 22px ;
	}
	.font20-25px{
		font-size: 25px ;
	}
	.font20-30px{
		font-size: 30px ;
	}
	.font22-25px{
		font-size: 25px ;
	}
	.font22-30px{
		font-size: 30px ;
	}
	.font25-30px{
		font-size: 30px ;
	}
	.font28-32px{
		font-size: 32px ;
	}
	.font30-35px{
		font-size: 35px ;
	}
	.font30-40px{
		font-size: 40px ;
	}
}
@media screen and (max-width: 767px) {
	.font10-12px{
		font-size: 10px ;
	}
	.font12-14px{
		font-size: 12px ;
	}
	.font14-16px{
		font-size: 14px ;
	}
	.font15-20px{
		font-size: 15px ;
	}
	.font15-18px{
		font-size: 15px ;
	}
	.font16-18px{
		font-size: 16px ;
	}
	.font16-20px{
		font-size: 16px ;
	}
	.font18-20px{
		font-size: 18px ;
	}
	.font18-25px{
		font-size: 18px ;
	}
	.font18-22px{
		font-size: 18px ;
	}
	.font20-22px{
		font-size: 20px ;
	}
	.font20-25px{
		font-size: 20px ;
	}
	.font22-25px{
		font-size: 22px ;
	}
	.font20-30px{
		font-size: 20px ;
	}
	.font22-30px{
		font-size: 22px ;
	}
	.font25-30px{
		font-size: 25px ;
	}
	.font28-32px{
		font-size: 28px ;
	}
	.font30-35px{
		font-size: 30px ;
	}
	.font30-40px{
		font-size: 30px ;
	}
}

/* ----------------------------------------------------------------------
 太字
---------------------------------------------------------------------- */
.bold{
    font-weight: bold;
}

/* ----------------------------------------------------------------------
 文字色
---------------------------------------------------------------------- */
.green{
    color: #247c3a;;
}
.brown{
    color:#754c2e;
}
.red{
    color:#ff0000;
}
.blue{
    color:#29abe2;
}

/* ----------------------------------------------------------------------
行間調整
---------------------------------------------------------------------- */
.lh10{
	line-height:1.0em;
}
.lh12{
	line-height:1.2em;
}
.lh15{
	line-height:1.5em;
}
.lh18{
	line-height:1.8em;
}
.lh20{
	line-height:2em;
}
.lh24{
	line-height:2.4em;
}

/* ----------------------------------------------------------------------
文字揃え
---------------------------------------------------------------------- */
.txtCenter{
	text-align:center;
}
.txtLeft{
	text-align:left;
}
.txtRight{
	text-align:right;
}

/* ----------------------------------------------------------------------
文字間
---------------------------------------------------------------------- */
.ls01{
	letter-spacing: 0.1em;
}
.ls02{
	letter-spacing: 0.2em;
}

/* ----------------------------------------------------------------------
PC・スマホ・タブレットのみ改行
---------------------------------------------------------------------- */

@media print, screen and (min-width: 768px) {
	.kaigyouSp {
		display: none;
	}
}
@media print, screen and (min-width: 480px) {
	.kaigyouSpS {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.kaigyouPc {
		display: none;
	}
}


/* ----------------------------------------------------------------------
margin・padding
---------------------------------------------------------------------- */
/*margin top*/
.mt00 {
	margin-top: 0px;
}
.mt05 {
	margin-top: 5px;
}
.mt10 {
	margin-top: 10px;
}
.mt15 {
	margin-top: 15px;
}
.mt20 {
	margin-top: 20px;
}
.mt25 {
	margin-top: 25px;
}
.mt30 {
	margin-top: 30px;
}
.mt35 {
	margin-top: 35px;
}
.mt40 {
	margin-top: 40px;
}
.mt45 {
	margin-top: 45px;
}
.mt50 {
	margin-top: 50px;
}
.mt80 {
	margin-top: 80px;
}
.mt100 {
	margin-top: 100px;
}
/*margin bottom*/
.mb00 {
	margin-bottom: 0px;
}
.mb05 {
	margin-bottom: 5px;
}
.mb10 {
	margin-bottom: 10px;
}
.mb15 {
	margin-bottom: 15px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb25 {
	margin-bottom: 25px;
}
.mb30 {
	margin-bottom: 30px;
}
.mb35 {
	margin-bottom: 35px;
}
.mb40 {
	margin-bottom: 40px;
}
.mb45 {
	margin-bottom: 45px;
}
.mb50 {
	margin-bottom: 50px;
}
.mb80 {
	margin-bottom: 80px;
}
.mb100 {
	margin-bottom: 100px;
}
/*margin left*/
.ml05{
	margin-left: 5px;
}
.ml10 {
	margin-left: 10px;
}
.ml15 {
	margin-left: 15px;
}
/*margin right*/
.mr30 {
	margin-right: 30px;
}
/*padding top*/
.pt05 {
	padding-top: 5px;
}
.pt10 {
	padding-top: 10px;
}
.pt15 {
	padding-top: 15px;
}
.pt20 {
	padding-top: 20px;
}
.pt25 {
	padding-top: 25px;
}
.pt30 {
	padding-top: 30px;
}
.pt35 {
	padding-top: 35px;
}
.pt40 {
	padding-top: 40px;
}
.pt45 {
	padding-top: 45px;
}
.pt50 {
	padding-top: 50px;
}
.pt80 {
	padding-top: 80px;
}
.pt100 {
	padding-top: 100px;
}
/*padding bottom*/
.pb05 {
	padding-bottom: 5px;
}
.pb10 {
	padding-bottom: 10px;
}
.pb15 {
	padding-bottom: 15px;
}
.pb20 {
	padding-bottom: 20px;
}
.pb25 {
	padding-bottom: 25px;
}
.pb30 {
	padding-bottom: 30px;
}
.pb35 {
	padding-bottom: 35px;
}
.pb40 {
	padding-bottom: 40px;
}
.pb45 {
	padding-bottom: 45px;
}
.pb50 {
	padding-bottom: 50px;
}
.pb80 {
	padding-bottom: 80px;
}
.pb100 {
	padding-bottom: 100px;
}
.pd10{
	padding: 10px;
}
.pd15{
	padding: 15px;
}
.pd20{
	padding: 20px;
}
.pd25{
	padding: 25px;
}
.pd30{
	padding: 30px;
}

/* ----------------------------------------------------------------------
画像
---------------------------------------------------------------------- */
img.img100{
	width:100%;
	display:block;
}
img.imgCenter{
	max-width: 100%;
	display:block;
	margin-left:auto;
	margin-right:auto;
}
img.imgLeft{
	max-width: 100%;
	display:block;
	margin-right:auto;
}
img.imgRight{
	max-width: 100%;
	display:block;
	margin-left:auto;
}


/* ----------------------------------------------------------------------
 ボタン
---------------------------------------------------------------------- */
.linkBtn {
    
}
.linkBtn a{
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 280px;
    background: #fff;
    border: 2px #754c2e solid;
    height: 40px;
    line-height: 40px;
    border-radius: 100px;
    box-sizing: border-box;
    text-decoration: none;
    transition: all 0.5s ease 0s;
    text-align: center;
}
.linkBtn a:hover{
    background: #f2f2f2;
}
.linkBtn a::after {
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transition: all 0.5s ease 0s;
    font-size: 80%;
}
.linkBtn a:hover::after{
    right: 10px;
}

/* ----------------------------------------------------------------------
 TOP COLUMN
---------------------------------------------------------------------- */

.pageMv{
   padding: 40px 0;
   width: calc(100% - 30px);
   max-width:1080px;
   margin: 0 auto 60px;
}
img.pageMvImg{
    position: relative;
    display: block;
    width: 100%;
    object-fit: cover;
    height: 400px;
    z-index: 1;
    border-radius: 15px 15px 0 0;
}
.pageMvTxt{
    position: relative;
    width: calc(100% - 100px);
    background: #fff;
    margin:-80px auto 0;
    z-index: 2;
    padding: 25px;
    box-sizing: border-box;
    border-radius: 15px;
}
.pageMvTxt h1{
    text-align: center;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
}
img.titIco{
    display: block;
    width: 45px;
    margin:1em auto 2em;
}
p.pageMvSubTit{
    font-size:16px;
    text-align: center;
    letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
    .pageMv{
       margin-bottom: 40px;
    }
    img.pageMvImg{
       height: 250px; 
    }
    .pageMvTxt{
        width: calc(100% - 50px);
        padding: 20px;
        margin:-50px auto 0;
    }
    .pageMvTxt h1{
        font-size:22px;
        letter-spacing: 0;
    }
}


/* ----------------------------------------------------------------------
 気血水・書籍一覧共通
---------------------------------------------------------------------- */
.list-cont-wrap{
    width: 100%;
    max-width: 1080px;
    margin: 0 auto 50px;
}
.listContents{
    display: flex;
    gap:40px;
    padding: 50px 0;
    border-bottom: 1px #dfdfdf solid;
}
.listContents:first-child{
    border-top: 1px #dfdfdf solid;
}
.listContentsImg{
    flex:0 0 400px;
}
.listContentsTxt{
    flex:1;
}

.listContentsTxt h3{
    position: relative;
    font-size: 25px;
    line-height: 1.5em;
    padding-bottom: 1em;
    margin: 1em 0;
}
.listContentsTxt h3::after {
    position: absolute;
    content: "";
    width: 100px;
    height: 5px;
    border-radius: 100px;
    background: #247c3a;
    bottom: 0;
    left: 0;
}
.listContentsTxt hr{
    border: none;
    border-top: 2px dotted #dfdfdf;
    padding: 15px 0;
}

@media screen and (max-width: 767px) {
	.listContents{
		display: block;
	}
	.listContentsImg{
		max-width: 400px;
		width: 100%;
		margin: 0 auto 40px;
	}
	.listContentsTxt{
		max-width: 600px;
		width: 100%;
		margin: 0 auto;
	}
}