@charset "UTF-8";

#breadcrumb {
    margin-bottom: 10px;
}
/*--------------------
メインコンテンツ
--------------------*/
#charity #mainHeader {
    margin-bottom: 20px;
}
#charity #mainHeader img {
    width: 100%;
}
#charity > .container {font-size: 120%;}
#charity > .container:last-of-type {
    padding-bottom: 50px;
}
#charity .column01 {
    margin-bottom: 40px;
}
#charity .column02 {
	width: 96%;
	margin: 0 auto 30px auto;
}
#charity .column02 > section {
	margin-bottom: 35px;
}

/*--------------------
メインコンテンツ：記事レイアウト
--------------------*/
article {
    position: relative;
    padding-bottom: 40px;
    width: 96%;
    margin: 0 auto;
}

/*------ ボタン ------*/

#charity .btn {
    width: 100%;
    margin: 0 auto;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.05em;
    position: relative;
    display: table;
    box-sizing: border-box;
    color: #ff5023;
    border: solid 2px #ff5023;
    background: rgba(255, 255, 255, 0.4);
    text-align: center;
    text-decoration: none;
    transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    text-shadow: none;
}
#charity .btn:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    display: block;
    content: '';
    background: #ff5023;
    transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#charity .btn.prev:before {
    right: 0;
	left: auto;
}
#charity .btn:hover:before,
#charity .btn:active:before {
    width: 100%;
}
#charity .btn span {
    position: relative;
    display: block;
    padding: 12px;
}
#charity .btn:hover span {
    color: #fff;
}
article .mainContent {
}
article .mainContent .block {
    margin: 0 auto 3em auto;
}
article .mainContent .block:last-of-type {
    margin: 0 auto;
}
article .mainContent .block:after {
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden;
    display: block;
    content: ".";
}
article .mainContent h2 {
	font-size: 18px;
	color: #666666;
	font-weight: bold;
	padding: 6px 10px;
	margin-bottom: 20px;
	position: relative;
	border-bottom: 2px solid #ff5023;
	border-left: 10px solid #ff5023;
}
article .mainContent .map {
	display: flex;
	flex-direction: column-reverse;
	justify-content: space-between;
	align-items: center;
}
article .mainContent .map img {
    max-width: 220px;
    width: 100%;
    margin-top: 1em;
}




.movie{
	width: 100%;
	margin: 0 auto;
}
.movie .movieCon{
    display: block;
    width: 100%;
    padding-top: 56.25%;
    position: relative;
    margin: 0 auto;
}
.movie .movieCon iframe{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-position: center;
    background-repeat: no-repeat;
    -moz-transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1);
    -webkit-transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1);
    transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1);
    background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
}

/*--------------------
サイド
--------------------*/

.column02 h3.ttl {
    color: #ff5023;
    font-weight: bold;
    text-align: center;
    font-size: 18px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.column02 h3.ttl:before,
.column02 h3.ttl:after {
    content: "";
    width: 20%;
    height: 2px;
    display: block;
    background: linear-gradient(to left, #ff5023 25%,transparent 25%) repeat-x;
    background-size: 10px 100%;
}
.column02 h4 {
	background: #ff724e;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: 16px;
    margin-bottom: 10px;
}
.column02 div span {
    color: #ff5023;
}
.column02 figure {
	text-align:center;
	margin-bottom: 10px;
}