@charset "UTF-8";

.container {
    display:flex;
	justify-content: center;
    flex-direction:row;
	align-items:flex-start;
	}
	
.container2 {
    display:flex;
    justify-content:center;
    flex-direction:column;
	}
	
.container3 {
    display:flex;
    justify-content: center;
    flex-direction:column;
	}

.container4 {
    display:flex;
	justify-content: center;
    flex-direction:row;
	}

.container5 {
    display:flex;
	justify-content:space-between;
	flex-direction:row;
	}


/* 要素のアキ */

.sect {
	margin:16px;
	}

/* スライドショーに文字を重ねる */

#outline {
	width:100%;
	position:relative;
	margin:0px auto;
	}

#overlap {
	width:100%;
	text-align:center;
	position:absolute;
	font-family: 'Cardo', serif;
	font-size:400%;
	color:#fff;
	bottom:25%;
	left:0px;
	z-index:10
	}

/* ボタンに文字を重ねる */

.toptbtn {
	width:100%;
	margin:		0;
	padding:	0;
	position:	relative; /* 相対位置指定 */
	}
	
.toptbtn img {
	width:100%;
	}
	
.topbtntxt {
	width:100%;
	font-size:160%;
	text-align:center;
	bottom:0px;
	margin:0;
	padding:12px 0 10px 0;
	color:#fff;
	background:	rgba(0,0,0,0.5); /* 帯の透明度 */
	position:absolute; /* 絶対位置指定 */
	font-family:'Yu Mincho';
}


@media only screen and (max-width: 1000px){
    .sect {margin:10px;}
	.topbtntxt {font-size:140%;padding:8px 0 6px 0;}
}

@media only screen and (max-width: 768px){
	.container4 {flex-direction:column;}
	.container5{flex-direction:column;}
    .sect {margin:8px;}
	.topbtntxt {font-size:130%;padding:6px 0 5px 0;}
	#overlap {
	width:100%;
	text-align:center;
	position:absolute;
	font-family: 'Cardo', serif;
	font-size:200%;
	color:#fff;
	bottom:25%;
	left:0px;
	z-index:10
	}
}


@media only screen and (max-width: 400px){
    .container {flex-direction:column;align-items:center;} 
	.container4 {flex-direction:column;}
	.sect {margin:6px;}
	.topbtntxt {font-size:140%;padding:8px 0 6px 0;}
}