@charset "UTF-8";

/* 基本色 */
:root {
	--main-color: #5D9AB2;
	--accent-color: #bf6aaf;
    --accent2-color: #ff0000;
	--dark-main-color: #2B5566;
	--text-bright-color: #ffffff;
    --text-h-color: #108EC1;
    --text-e-color: #4e4e4e;
	--icon-color: #fff;
	--icon-bk-color: #ddd;
	--gray-color: #ddd;
	--large-width: 1000px;
	--middle-width: 900px;
}


/* 基本設定： フォントサイズ */
@media (max-width: 599px) {
	:root {
		font-size: 14px;
	}
}

@media (min-width: 600px) and (max-width: 849px) {
	:root {
		font-size: 16px;
	}
}

@media (min-width: 850px) {
	:root {
		font-size: 17px;
	}
}

body {font-size: 16px;}



/* 基本設定： ページ全体 */
body {
	margin: 0;
	font-family: 'メイリオ',
		'Hiragino Kaku Gothic Pro', 
		sans-serif;
    /*background-color: rgb(255, 255, 0)*/
}







.tobemoriA {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;*/
	min-height: 500px;
	background-image:url(./img/top.jpg);
	background-position: top center;
	background-repeat: repeat-x;
	background-color: #EAE1B2;
	text-align: center;
	background-size: cover;
	color: rgb(255, 255, 255);
    text-shadow:
        1px 0 0 rgb(0, 0, 0),
        1px 1px 0 rgb(0, 0, 0),
        0 1px 0 rgb(0, 0, 0),
        -1px 1px 0 rgb(0, 0, 0),
        -1px 0 0 rgb(0, 0, 0),
        -1px -1px 0 rgb(0, 0, 0),
        0 -1px 0 rgb(0, 0, 0),
        1px -1px 0 rgb(0, 0, 0);

}


.tobemoriB {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;
	min-height: 530px;*/
	color: #4e4e4e;
	color: var(text-e-color);
	text-align: center;
	background-color: #00800d;


}


.tobemoriB2 {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;
	min-height: 530px;*/
	color: #4e4e4e;
	color: var(text-e-color);
	text-align: center;

	background-image: url(event/brighton_mannaka/img/yellow.png);
background-position:center;

}


.tobemoriC {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;
	min-height: 530px;*/

	text-align: center;

background-position:center;
}


.tobemoriA > .container {
	max-width: 900px;
	max-width: var(--middle-width);
	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;

}





.tobemoriB > .container {
	max-width: 900px;
	max-width: var(--middle-width);
	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;

}



.tobemoriC > .container {
	max-width: 650px;

	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;


}






.tobemoriB a, .tobemoriC a,{

	padding: 10px;
    color: var(--text-h-color);
    color:  #108EC1;
	text-decoration: none;
}


.tobemoriA h1 {
    color: var(--text-e-color);
    color:  #4e4e4e;
	font-size: 2rem;
}

.tobemoriB h2 {
color: var(--text-e-color);
color:  #ffffff;
  position: relative;
  padding: 0 0 0 0;

    display: block;
    font-size: 1.5em;
    margin: 0;
    font-weight: bold;





}







.tobemoriC h2 {
color: var(--text-e-color);
  position:relative;
  padding: 4em 1em 0 0;

}


.tobemoriB h3 {
color: var(--text-e-color);
color:  #4e4e4e;
font-size: 1.4rem;
  position: relative;
  padding: 0.6em;

}

.tobemoriB h4 {
	color: var(--text-e-color);
	color:  #4e4e4e;
	font-size: 1.1rem;
	  position: relative;
	  padding: 0.6em;
	  line-height: 2rem;

	
	}

.tobemoriB img.title {

	max-width: 350px;


}


.tobemoriC img.title {

	max-width: 350px;

}







.tobemoriC h3 {

color:  #ffffff;
font-size: 1.4rem;
   padding: 0 0 0 1.25rem  ;
	line-height: 2;
    text-align: left;

}






.tobemoriB p  {
	font-size: 0.95rem;
    padding: 0.5rem 0;
	line-height: 1.5rem;
	margin-bottom: 1rem;
	text-align: left;
    color: var(--text-e-color);
color:  #4e4e4e;
}

.story  {
	font-size: 0.95rem;

	line-height: 2.5rem;

	text-align: center;
    color: var(--text-e-color);
color:  #4e4e4e;
}


.tobemoriB .font-small {
	font-size: 0.85rem;
	line-height: 0.95rem;
	
	}
	




.tobemoriB .box_br {
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 25px;
    background: #ffffffc2;
	
	
    border-radius: 40px; 

}

.tobemoriB .box_br p {
	color: var(--text-e-color);
	color:  #4e4e4e;
	  position: relative;
	  padding: 0 15%;

	  line-height: 1.7rem;
	  font-weight: 150 ;


	

}



.tobemoriB img {
	max-width: 70%;
        padding: 2em 0 1em 0  ; 
}


.tobemoriB img.item {
	max-width: 50%;

}






.tobemoriC p  {
	font-size: 0.85rem;
    	padding-left: 1rem;
	line-height: 2;
color:  #000000;
    text-align: left;
}











.tobemoriB2 > .container {

margin: 0px auto;


}

.tobemoriB2 h2 {
color: var(--text-e-color);
color:  #4e4e4e;
  position: relative;
  padding: 4% 0 0 0;
  margin: 0%;

}

.tobemoriB2 p  {
	font-size: 1rem;
   padding-left: 4rem;
   padding-right: 4rem;
   text-align: left;
	line-height: 2;
color:  #4e4e4e;

}






.tobemoriB2 img {
	max-width: 70%;
        padding: 2em 0 1em 0  ; 
}
.tobemoriB2 img.item {
	max-width: 80%;

}

.tobemoriB2 img.title {

	max-width: 350px;

}








	.tobemoriB2 .text	{
		text-align: center;



	}



@media (min-width: 700px) {

.tobemoriA {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;*/
	min-height: 1000px;
	
	background-position: top center;
	background-repeat: repeat-x;
	text-align: center;
	background-size: cover;
}

	.tobemoriB2 .container {
		display: flex;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
				align-items:baseline;
	}

	.tobemoriB2 .text	{
		flex: 1 1 300px;
                margin-left: auto;
		margin-right: auto;
	}
		.tobemoriB2 .text p	{
			text-align: left;
	font-size: 1rem;
	padding-left: 1rem;
   padding-right: 1rem;

	}


	.tobemoriB2 .text2	{
		flex: 1 1 250px;
                margin-left: auto;
		margin-right: auto;
	}
		.tobemoriB2 .text2 p	{
			text-align: left;
	font-size: 1rem;
	line-height: 1.6rem;
	padding-left: 1rem;
   padding-right: 1rem;

	}

	.tobemoriB2 .text2 .font-small	{
font-size: 0.85rem;
line-height: 0.95rem;

}





.tobemoriB img.item {
	max-width: 80%;

}

.tobemoriB2 img {
	max-width: 80%;
        padding: 2em 0 1em 0  ; 
}
}
















/*
.tobemoriC img {
	max-width: 100%;
    text-align: left;
}*/

.tobemoriC img.item {
	max-width: 70%;

}

.tobemoriC img {
	max-width: 60%;
    padding: 2em 0 1em 0  ; 
    text-align: center;









.brighton .btn{
  display: inline-block;
  text-decoration: none;
  color: #668ad8;
  width: 120px;
  height: 120px;
  line-height: 120px;
  border-radius: 50%;
  border: solid 2px #668ad8;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  font-weight: bold;
  transition: .4s;
}

.brighton .btn:hover {
    background: #b3e1ff;
}



.look {background: rgba(0,0,0,0.1);border: 1px solid #ccc;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px;}
.mb30 {margin-bottom: 30px;}
.clear {clear: both;}
.color1, .color1 a {color: #f38080;}
.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center;}
.r {text-align: right;}
.l {text-align: left;}
.big1 {font-size: 40px;letter-spacing: 0.2em;}
.big2 {font-size: 1.2em;letter-spacing: 0.05em;margin-left: 0.2em;}
.mini1 {font-size: 11px;}

.imgc {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}
.dropshadow {
	filter: drop-shadow(0 0 0.75rem  #808080);
	}