@charset "utf-8";

:root{
	--MainWitdh:1000px;
	--MainColor: #b7a665;
	--MainColorDark: #a99859;
	--MainColorPale: #e8e5dc;
	--iconPadding: 4px 7px;
	}

article{}
article a{ color: #333}

 article img{width: 100%; height: auto}

/*--------------------------------*/
#Lineup{width: var(--MainWitdh);margin: 0 auto;padding-bottom: 60px;}
#Lineup .Entry{
	display: flex;
	justify-content: space-between;
	border: 3px solid #dcdcdc;
	padding: 20px 20px;
	border-radius: 4px;
}
#Lineup .Entry + .Entry{
	margin-top: 20px;
}
#Lineup .Entry .photo{
	width: 260px;
}
#Lineup .Entry .photo img{
	width: 100%;
}
#Lineup .Entry .Main{
	flex: 1;
	margin-left: 20px;
	align-self: center;
}
#Lineup .Entry .Main .date{
	font-weight: bold;
	margin-bottom: 5px;
	font-size: 15px;
}
#Lineup .Entry .Main .date .icon{
	font-size: 12px;
	display: inline-block;
	background-color: var(--MainColor);
	color: #fff;
	line-height: 1;
	padding: var(--iconPadding);
	margin-right: 10px;
}
#Lineup .Entry .Main dl{}
#Lineup .Entry .Main dt{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 10px;
}
#Lineup .Entry .Main dd{
	font-size: 15px;
}


/*------------------------------------Wrap*/
#Wrap{
	width: var(--MainWitdh);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	padding-top: 20px;
	position: relative;
}

/*-----------------------------------------Side*/
#Side{
    width: 250px;
    padding-bottom: 50px;
}
#Side .humb{
    display: none;
}
#Side .Inner{}
#Side .Inner h2{
	margin-bottom: 30px;
	text-align: center;
	border-top: 2px solid var(--MainColor);
	border-bottom: 2px solid var(--MainColor);
	padding: 12px 0;
}
#Side .Inner h2 .main{
	font-size: 40px;
	padding-bottom: 10px;
}
#Side .Inner h2 .sub{
	font-size: 13px;
}
#Side .Inner dl{
    -webkit-transition: all .3s ease-out;
    display: flex;
    padding: 5px;
    border-radius: 2px;
    border: 1px solid #ccc;
}

#Side .Inner dl + dl{
    margin-top: 10px;
}
#Side .Inner dt{
    width: 70px;
    height: 70px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 2px;
}
#Side .Inner dd{
    font-weight: bold;
    font-size: 13px;
    flex: 1;
    margin-left: 14px;
    align-self: center;
}
#Side .Inner dd .icon{
	display: block;
	width: fit-content;
	background-color: var(--MainColor);
	color: #fff;
	font-size: 10px;
	line-height: 1;
	padding: var(--iconPadding);
	margin-bottom: 4px;
}
#Side .Inner dd a{}
#Side .Inner dd a span{
    display: block;
    font-size: 12px;
    font-weight: normal;
}
#Side .Inner dl.active,
#Side .Inner dl:hover{background-color: #f3f1ec;border-color: var(--MainColor);}
#Side .Inner dl:hover{
    cursor: pointer;
}
#Side .Inner dl:hover dt{}
#Side .Inner dl:hover a{
    text-decoration: none;
}
/*-----------------------------------------Contents*/
#Contents{
    padding-bottom: 110px;
    flex: 1;
    margin-right: 40px;
}
/*--------------------------------*/

#Contents .MainTitle{margin-bottom: 50px;}
#Contents .MainTitle .Main{
	margin-bottom: 25px;
	border-bottom: 1px solid #a9a9a9;
	padding-bottom: 15px;
}
#Contents .MainTitle .Main .date{
	font-weight: bold;
	padding-bottom: 5px;
}
#Contents .MainTitle .Main .date .icon{
	background-color: var(--MainColor);
	color: #fff;
	font-size: 12px;
	padding: var(--iconPadding);
	display: inline-block;
	margin-right: 6px;
	line-height: 1;
}
#Contents .MainTitle .Main .date .txt{
	color: var(--MainColor);
}
#Contents .MainTitle .Main h1{
	font-size: 25px;
	line-height: 1.4;
	display: flex;
	letter-spacing: -0.5px;
	flex-wrap: wrap;
}
#Contents .MainTitle .Photo{line-height: 0;margin-bottom: 20px;}
#Contents .MainTitle .Photo .img{}
#Contents .MainTitle .Photo img{
	width: 100%;
}
#Contents .MainTxt{
	font-size: 15.5px;
	margin-bottom: 20px;
	line-height: 2;
}

#Contents .PostList {position:relative;border: 3px solid var(--MainColor);padding: 15px;}
#Contents .PostList .deco {border-top: 30px solid var(--MainColor);border-right: 30px solid var(--MainColorDark);border-bottom: 30px solid transparent;border-left: 30px solid transparent;font-weight: normal;position: absolute;top: -3px;text-align: left;width: 0;right: -3px;height: 0;border-style: solid;}
#Contents .PostList .deco span { text-align: center; display: block; position: absolute; left: -13px; color: #fff; font-size: 13px; line-height: 1; bottom: 1px; letter-spacing: 1px; transform: rotate(45deg); }

#Contents .PostList ul { }
#Contents .PostList li { font-size: 16px; padding-left:16px;}
#Contents .PostList li a span{
	font-weight: bold;
	display: inline-block;
	padding-right: 4px;
}
#Contents .PostList li a span:after{content: ".";}
#Contents .PostList li + li {padding-top: 6px;}
#Contents .PostList li.sub{margin-left: 15px;font-size: 14px;}
#Contents .PostList li.sub + li{margin-top: 6px;} 
#Contents .PostList li.sub + .sub{ margin-top: 0;} 
#Contents .PostList li:before{content: "\f13a";display:block;float:left;margin-left:-18px;color: var(--MainColor);width:1.4em;text-align:center;font-family:FontAwesome;}
#Contents .PostList li.sub:before{content: "\f078";font-size: 12px;margin-top: 3px;}


/*--------------------*/
#Contents .Sec{
	line-height: 2;
	padding-top: 10px;
}
#Contents .Sec + .Sec{
	margin-top: 70px;
}
#Contents .Sec h2{
	font-size: 19px;
	background-color: var(--MainColorPale);
	padding: 10px 17px 10px 47px;
	margin-bottom: 20px;
	line-height: 1.6;
	position: relative;
}
#Contents .Sec h2 span{
	color: var(--MainColor);
	font-size: 130%;
	display: inline-block;
	padding-right: 5px;
	position: absolute;
	top: 5px;
	left: 18px;
}
#Contents .Sec h3{
	font-size: 20px;
	border-left: 5px solid var(--MainColor);
	line-height: 1;
	padding-left: 5px;
	margin-bottom: 15px;
}
#Contents .Sec h3 span{
	color: var(--MainColor);
}
#Contents .Sec h2 span:after,
#Contents .Sec h3 span:after{content: ".";}
#Contents .Sec .Entry{
}
#Contents .Sec .Entry + .Entry{
	margin-top: 40px;
}
#Contents .Sec .Entry .txt{
	font-size: 15.5px;
	margin-bottom: 1em;
}
#Contents .Sec .Entry .data + .txt {
	margin-top: 1em;
}
#Contents .Sec .Entry .txt.border{border-bottom: 2px dotted #a9a9a9;padding-bottom: 25px;}
#Contents .Sec .Entry .txt em{
	font-weight: bold;
}
#Contents .Sec .Entry .txt strong{
	background: linear-gradient(transparent 60%, #f1edd2 60%);
}
#Contents .Sec .Entry .data{
	border: 2px solid var(--MainColorPale);
	padding: 10px 10px;
	border-radius: 3px;
	font-size: 13px;
	font-weight: bold;
}
#Contents .Sec .Entry .data dl{
	display: flex;
	/* font-weight: bold; */
}
#Contents .Sec .Entry .data dl + dl{
	margin-top: 10px;
}
#Contents .Sec .Entry .data dt{width: 15em;background-color: var(--MainColorPale);text-align: center;padding: 6px 15px;box-sizing: border-box;display: flex;align-items: center;justify-content: center;line-height: 1.6;}
#Contents .Sec .Entry .data dd{
	padding-left: 10px;
	flex: 1;
	align-self: center;
}
#Contents .Sec .Entry .btn{
	margin-bottom: 30px;
}
#Contents .Sec .Entry .btn a{position: relative;display: inline-block;background-color: var(--MainColor);padding: 15px 40px;text-decoration: none;color: #fff;font-size: 15px;}
#Contents .Sec .Entry .btn a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\f105"; font-family:FontAwesome; line-height: 1}
#Contents .Sec .Entry .btn a:hover{
	background-color: var(--MainColorDark);
}
#Contents .Sec .Entry .photo{margin-bottom: 15px;line-height: 0;}
#Contents .Sec .Entry .photo .caption{line-height: 1.4;font-size: 13px;padding-top: 7px;}
#Contents .Sec .Entry .photo .caption + img{
	margin-top: 20px;
}
#Contents .Sec .Entry h3 + .photo{
	margin-top: 25px;
}
#Contents .Sec .Entry .photo ul{
	display: flex;
	flex-wrap: wrap;
}
#Contents .Sec .Entry .photo li{position: relative;flex: 1;}
#Contents .Sec .Entry .photo li img{
	width: 100%;
}
#Contents .Sec .Entry .photo.widthMax li img{
	width: auto;
}
#Contents .Sec .Entry .photo li .caption{}
#Contents .Sec .Entry .photo li + li{
}
#Contents .Sec .Entry .photo li + li:before{content:"";position: absolute;width: 5px;height: 100%;top: 0;left: 0;background-color: #fff;}

#Contents .Sec .Entry .point{
	font-size: 15px;
	margin-bottom: 15px;
}
#Contents .Sec .Entry .point dt{
	font-weight: bold;
}
#Contents .Sec .Entry .point dd{
}
#Contents .Sec .Entry .point dd + dt{
	margin-top: 15px;
}

/*---------------------------Navi*/
#Contents .editor{
	text-align: right;
	border: 1px solid #ccc;
	padding: 10px 10px;
	font-size: 13px;
	border-radius: 3px;
	margin-top: 40px;
}
#Contents .Navi{
	margin-top: 20px;
	display: flex;
	padding: 15px;
	background-color: #f1f1f1;
}
#Contents .Navi dl{
    display: flex;
    flex: 1;
}

#Contents .Navi dl + dl{border-left: 1px solid #ccc;margin-left: 20px;padding-left: 20px;}
#Contents .Navi dt{
    width: 70px;
    height: 70px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 2px;
}
#Contents .Navi dd{
    font-weight: bold;
    font-size: 13px;
    flex: 1;
    margin-left: 14px;
    align-self: center;
}
#Contents .Navi dd .icon{
	display: block;
	width: fit-content;
	background-color: var(--MainColor);
	color: #fff;
	font-size: 10px;
	line-height: 1;
	padding: var(--iconPadding);
	margin-bottom: 4px;
}
#Contents .Navi dd a{}
#Contents .Navi dd a span{
    display: block;
    font-size: 12px;
    font-weight: normal;
}
#Contents .Navi dd .icon:before,
#Contents .Navi dd .icon:after{
	display: inline-block;
	font-weight: normal;
}

#Contents .Navi .NaviPrev dd .icon:before{content:"\f104";font-family:FontAwesome;padding-right: 4px;}
#Contents .Navi .NaviNext dd .icon:before{content:none}
#Contents .Navi .NaviNext dd .icon:after{content:"\f105";font-family:FontAwesome;padding-left: 4px;}