@charset "utf-8";

/* スタイルシート追加
作成者：Hirama Inc.
作成日：R3.09.17

-------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1151px) {}

@media only screen and (min-width: 769px) and (max-width: 1150px){}

@media only screen and (min-width: 641px) and (max-width: 768px){}

@media only screen and (max-width: 640px){}

.custom {}

.custom #main {}

.custom #main .block {
width:100%;
position:relative;
}

.custom #main .title {
color: #BA6E86;
}

@media only screen and (min-width: 1151px) {
.custom #main .title {
font-size: 3.2rem;
margin-bottom:30px;
}
}

@media only screen  and (min-width: 769px)and (max-width: 1150px){
.custom #main .title {
font-size: 3.0rem;
margin-bottom:20px;
}
}

@media only screen  and (min-width: 641px)and (max-width: 768px){
.custom #main .title {
font-size: 2.8rem;
margin-bottom:20px;
}
}

@media only screen and (max-width: 640px){
.custom #main .title {
font-size: 2.5rem;
margin-bottom:20px;
}
}

/* next */
.custom #main .next {}

.custom #main .next a {
width: 100%;

display: inline-block;
text-align: center;
text-decoration: none;
color: #FFF;
}

.information #main .next a {
border: 2px solid #67233A;
background-color:#67233A;
}

@media only screen and (min-width: 769px) {
.custom #main .next a {
height:60px;
line-height: 55px;

font-size:1.6rem;
letter-spacing:0.1em;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.custom #main .next a {
height:50px;
line-height: 46px;

font-size:1.3rem;
}
}

@media only screen and (max-width: 640px){
.custom #main .next a {
height:45px;
line-height: 41px;

font-size:1.2rem;
}
}

.custom #main .next a:hover {
border-color: #CCC;
background-color:#CCC;
color: #333;
}

/*********************************************************

list

**********************************************************/

.custom #main.list {}

/*information*/
.information #main.list {}

.information #main.list dl {
display:-webkit-box;	display:-webkit-flex;	display:-ms-flexbox;	display:flex;
-webkit-box-orient:horizontal;	-webkit-box-direction:normal;	-webkit-flex-direction:row;	-ms-flex-direction:row;	flex-direction:row;
}

@media only screen  and (min-width: 769px){
.information #main.list dl {
-webkit-flex-wrap:wrap;	-ms-flex-wrap:wrap;	flex-wrap:wrap;
-webkit-box-align:start;  -webkit-align-items:flex-start;  -ms-flex-align:start;  align-items:flex-start;
}		
}

@media only screen and (max-width: 768px){
.information #main.list dl {
-webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column;
}		
}

.information #main.list dl > dt {}

@media only screen  and (min-width: 769px){
.information #main.list dl > dt {
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
margin-bottom: 18px;
padding-bottom: 15px;
width: 120px;
}

.information #main.list dl > dt:nth-last-of-type(1) {
background-image: none;
margin-bottom: 0;
padding-bottom: 0;
}

}

@media only screen  and (max-width: 768px){
.information #main.list dl > dt {
width: 100%;
display:block;
margin-bottom: 18px;
}
}

.information #main.list dl > dt time {
display:inline-block;
vertical-align:middle;
}

.information #main.list dl > dd {
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
margin-bottom: 18px;
padding-bottom: 15px;
}

@media only screen and (min-width: 769px){
.information #main.list dl > dd {
width: -webkit-calc(100% - 140px);
width: calc(100% - 140px);
display:inline-block;
vertical-align:middle;
-webkit-align-self: stretch;-ms-flex-item-align: stretch;align-self: stretch;
padding-left:10px;
}

.information #main.list dl > dd:nth-last-of-type(1) {
margin-bottom: 0;
padding-bottom: 0;
}
}

@media only screen and (max-width: 768px){
.information #main.list dl > dd {
width: 100%;
display:block;
}	
}

.information #main.list dl > dd:nth-last-of-type(1) {
background-image: none;
}


/*********************************************************

detail

**********************************************************/

.custom #main.detail {}

/*information*/
.information #main.detail {}

.information #main.detail .block {}

@media only screen and (min-width: 1151px) {
.information #main.detail .block {
margin-bottom:40px;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.information #main.detail .block {
margin-bottom:30px;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.information #main.detail .block {
margin-bottom:25px;
}
}

@media only screen and (max-width: 640px){
.information #main.detail .block {
margin-bottom:25px;
}
}

.information #main.detail .date {
text-align:right;
}

@media only screen and (min-width: 1151px) {
.information #main.detail .date {
margin-bottom:20px;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.information #main.detail .date {
margin-bottom:20px;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.information #main.detail .date {
margin-bottom:15px;
}
}

@media only screen and (max-width: 640px){
.information #main.detail .date {
margin-bottom:12px;
font-size:1.1rem;
}
}

.information #main.detail .block figure {
width:100%;
}

.information #main.detail .block figure img {
width:100%;
}

.information #main.detail .block figure + p {
width:100%;
margin-top:25px;
}

.information #main.detail .block h4 {
border-left: 5px solid #BA6E86;
color:#BA6E86;
font-weight: bold;
padding: 0.03em 0 0.03em 0.9em;
}

@media only screen and (min-width: 1151px) {
.information #main.detail .block h4 {
font-size: 2.5rem;
margin: 0 0 20px;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.information #main.detail .block h4 {
font-size: 2.3rem;
margin: 0 0 20px;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.information #main.detail .block h4 {
font-size: 1.4rem;
margin: 0 0 15px;
}
}

@media only screen and (max-width: 640px){
.information #main.detail .block h4 {
font-size: 2.0rem;
margin: 0 0 15px;
}
}