@charset "utf-8";

/* CSS Document */

html, body {

	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #552100;
	letter-spacing: 1px;
}

html {
	font-size: 62.5%;
}
html {
	font-size: calc(1em * .625);
}

body {
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.6;
}

@media screen and (max-width: 480px) {

	body {
		font-size: 13px;
		font-size: 1.3rem;
		line-height: 1.4;
	}

}



/*

======================================

	clear

======================================	

*/


.clearfix:after {
	content: " ";
	display: block;
	visibility: hidden;
	height: 0px;
	clear: both;
}

/* for IE6 */
* html .clearfix {
display:inline-block;
}
/* for IE7 */
*+html .clearfix {
display:inline-block;
}
.clear {
    clear: both;
    display: none;
    font-size: 0;
    height: 0;
    line-height: 1em;
    margin: 0;
    padding: 0;
    width: 0;
}



/*

======================================

	module

======================================	

*/

.mt5 {
	margin-top: 5px;
}
.mt10 {
	margin-top: 10px;
}
.mt20 {
	margin-top: 20px;
}
.mb10 {
	margin-bottom: 10px;
}
.mb15 {
	margin-bottom: 15px;
}
.mb30 {
	margin-bottom: 30px;
}

/*

======================================

	layout

======================================	

*/

body {
	width: 100%;
	background: url("../img/bg01.png") repeat;
}

img {
	max-width: 100%;
	width: auto;
	height: auto;
	vertical-align: bottom;
}

a {
	color: #8C0000;
	text-decoration: none;
}

a:hover {
	color: #FF3C3C;
}
a:hover {
	opacity: 0.7 ;
}

.center{ text-align: center; }
	
.red{ color:#C00; }

.bold{ font-weight: bold; }


@media screen and (max-width: 767px) {

	.for-pc {
		display: none;
	}
}


@media screen and (min-width: 768px) {

	.for-sp {
		display: none;
	}
}

@media screen and (max-width: 768px) {

/*section {
	padding: 0% 3%;
	}*/
	
}


#wrapper{
	width: 100%;
	}

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

	section

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

#header_area {
	width: 100%;
	height: 717px;
}
#header_area .header_bg{
	height: 620px;
	background: #91d1df;
}

#header_area h1 {
	width: 1400px;
	margin: 0 auto;
}

@media screen and (max-width: 768px) {
	
#header_area {
	height: auto;
}

#header_area h1 {
	width: 100%;
}
#header_area .header_bg{
	height: auto;
}
}


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


#content {
	width: 1200px;
	text-align: center;
	margin:  0 auto;
}
#content h1 {
}
#content h2 {
	color: #e5004f;
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 0.5em;
}

.btnbox{
	margin: 1em 0;
}

@media screen and (max-width: 768px) {

#content {
	width: 100%;
	padding: 0 2%;
}
#content h1 {
	}
#content h2 {
	font-size: 18px;
}
.btnbox{
	max-width: 80%;
	margin: 1em auto;
	}

}

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

.info{
	font-weight: bold;
	margin-top: 2em;
	}

.about{
	width: 1200px;
	font-weight: bold;
	margin: 6em 0 3em;
}
.about h3{
	background: url(../img/ttl_nagasaki.png) no-repeat center;
	height: 121px;
	margin: 0 auto 10px;
	text-indent: -9999px;
	overflow:hidden;
	}

.aboutbox {
    background: #fff;
	background: url("../img/bg_about.png") repeat;
    width: 100%;
    height: auto;
    border-radius: 12px;
	padding: 4em 0 2em;
}
.aboutbox .nagasaki_map{
	width: 45%;
}
.aboutbox .ichioshi{
	width: 55%;
}
.aboutbox .ichioshi .catch{
	font-size: 25px;
	margin-bottom: 20px;
}


.about .sponsorship{
	width: 100%;
	margin: 20px auto;
}
.about .sponsorship h4{
	font-size: 18px;
	font-weight: bold;
	padding-top: 15px;	
}


@media screen and (max-width: 768px) {

.info{
	}
	
.about{
	width: 100%;
	margin: 2em 0 3em;
}
.about h3{
	background: url(../img/ttl_nagasaki.png) no-repeat center center;
	background-size: contain;
	margin: 0 auto -10px;
	max-width: 80%;
	}

.aboutbox {
	padding: 0em 0 0em;
}
.aboutbox .nagasaki_map{
	width: 100%;
	margin-bottom: 20px;
}
.aboutbox .ichioshi{
	width: 100%;
}
.aboutbox .ichioshi .catch{
	font-size: 18px;
	margin-bottom: 15px;
}
.about .sponsorship{
}
.about .sponsorship h4{
}

}

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


.comments{
	font-size: 13px;
	text-align: center;
	margin: 15px 0;
	}

@media screen and (max-width: 768px) {

.comments{
	font-size: 13px;
	text-align: center;
	margin: 15px 0;
	}

}



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

ul{    
    list-style: none;
	display:flex;
	justify-content: center;
}
ul,li{
    margin: 12px 5px;
    padding: 0px;
}
.sns{    
    padding: 0px 12px;
}

@media screen and (max-width: 768px) {
ul{    
	display: inline;
}
}




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


.flex {	
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-direction: row;/* Safari */
		-webkit-flex-wrap: wrap; /* Safari */
		flex-direction: row;
		flex-wrap: wrap;
		-webkit-justify-content: space-between; /* Safari */
		justify-content: space-between;
	}

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


@media screen and (min-width: 768px) {

	

	.inner {
		margin: 0 auto;
		max-width: 1070px;
		position: relative;
		padding: 0 2%;
	}



}






/*改行*/
@media screen and (max-width: 640px) {
    .br-sp { display:none; }
}
/*改行*/
@media screen and (max-width: 640px) {
    .br-pc { display:none; }
}




/*header＆footer
----------------------------------------*/

.header_simple{
	background:#231815;
}

.ft_contents{
	background: #490505;
	color:#fff;
}

.footer_simple{
	padding:20px 0;
	/*text-align: center;*/
}

.footer_simple .copyright{
	color:#fff;
}