* {
	box-sizing: border-box;
}
*:before, *:after {
	box-sizing: border-box;
}

.row {
	width: 100%;
	max-width: 1020px;
	margin: 0 auto;
	overflow: hidden;
	padding-top: 50px;
}
@media only screen and (max-width: 766px) {
	.row {
	padding: 0 10px;
}
}

.colon1, .colon2, .colon3, .colon4, .colon5, .colon6, .colon7, .colon8, .colon9, .colon10, .colon11, .colon12 {
	min-height: 10px;
	margin: 1.0416666667%;
	float: left;
	overflow: hidden;
	
}
@media only screen and (max-width: 766px) {
	.colon1, .colon2, .colon3, .colon4, .colon5, .colon6, .colon7, .colon8, .colon9, .colon10, .colon11, .colon12 {
	margin-left: 0;
	margin-right: 0;
}
}

body {
	
	
	margin: 0;
	padding: 0;
	color: #dd;
	font-family: 'sans-serif';
	
}

h1 {
	text-align: center;
	font-size: 45px;
	line-height: 6;
	padding: 45px 0 0;
	color: #aaaaaa;
}


.colon5 {
	width: 39.5833333333%;
}
@media only screen and (max-width: 766px) {
	.colon5 {
	width: 100%;
}
}

.colon7 img{
	
	width: 100%;
}

.colon7 {
	width: 56.25%;
}
@media only screen and (max-width: 766px) {
	.colon7 {
	width: 100%;
}
}

.setsumei{
	width: 100%;
	height: 100%;
	padding: 20% 0 ;
	
}
@media only screen and (max-width: 766px) {
	.setsumei {
	width: 100%;
	padding: 0 ;
}
}

h3 {
	position: relative;
	color: #333333;
	display: inline-block;
	margin: 47px 0;
	text-shadow: 0 0 2px white;
}
@media only screen and (max-width: 766px) {
	h3 {
	
	font-size: 20px;
}
}
h3:before {
	content: "";
	position: absolute;
	background: #ffd69d;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	top: 50%;
	/* border: dashed 1px white; */
	left: 50%;
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	z-index: -1;
}

p{
	
	font-size: 13px;
    font-weight: lighter;
  　
}
@media only screen and (max-width: 766px) {
	p {
	font-size:14px;
}
}

.square_btn{
	display: inline-block;
	padding: 0.5em 1em;
	text-decoration: none;
	background: #ffbf00;/*ボタン色*/
	color: #FFF;
	border-bottom: solid 4px #dda718;
	border-radius: 3px;
    font-size: 15px;
}
.square_btn:active {/*ボタンを押したとき*/
	-ms-transform: translateY(4px);
	-webkit-transform: translateY(4px);
	transform: translateY(4px);/*下に動く*/
	border-bottom: none;/*線を消す*/
}



/* HEADLINE STRUCTURE */
.headline {
	display: block;
	width: 95%;
	margin: 0 auto;
	padding: 0;
	position: relative;
	text-align: center;
}

.lines {
	display: inline-block;
	position: absolute;
	top: 40%;
}
.lines svg {
	width: 200px;
	height: 32px;
}
@media screen and (max-width: 650px) {
	.lines svg {
	width: 90px;
	height: 15px;
}
}

.text {
	display: inline-block;
	max-width: 60%;
	padding: 1em 30px;
	text-align: center;
	font-family: Didot, "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif;
	text-transform: uppercase;
	font-size: 35px;
	letter-spacing: 10px;
	line-height: 1.5em;
	color: #808080;
}
@media screen and (max-width: 650px) {
	.text {
	font-size: 20px;
	letter-spacing: 2px;
}
}

.left {
	float: right;
	margin-left: -220px;
}

.right {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
	float: left;
	margin-left: -10px;
}

/* ANIMATION */
#headline {
	-webkit-transform: translate(115px, 0px) scalex(1);
	-moz-transform: translate(115px, 0px) scalex(1);
	-ms-transform: translate(115px, 0px) scalex(1);
	-o-transform: translate(115px, 0px) scalex(1);
	transform: translate(115px, 0px) scalex(1);
	/* @include transform-origin(right); */
}

.pulse #headline {
	-webkit-animation: grow 2s infinite;
	-moz-animation: grow 2s infinite;
	animation: grow 2s infinite;
}

@keyframes grow {
	0% {
	-webkit-transform: translate(115px, 0px) scalex(1);
	-moz-transform: translate(115px, 0px) scalex(1);
	-ms-transform: translate(115px, 0px) scalex(1);
	-o-transform: translate(115px, 0px) scalex(1);
	transform: translate(115px, 0px) scalex(1);
	-webkit-transform-origin: right;
	-moz-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
}
30% {
	-webkit-transform: translate(115px, 0px) scalex(2);
	-moz-transform: translate(8px, 0px) scalex(2);
	-o-transform: translate(0px, 0px) scalex(2);
	-webkit-transform-origin: right;
	-moz-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
}
}
@-webkit-keyframes grow {
	0% {
	-webkit-transform: translate(115px, 0px) scalex(1);
	-moz-transform: translate(115px, 0px) scalex(1);
	-ms-transform: translate(115px, 0px) scalex(1);
	-o-transform: translate(115px, 0px) scalex(1);
	transform: translate(115px, 0px) scalex(1);
	-webkit-transform-origin: right;
	-moz-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
}
30% {
	-webkit-transform: translate(115px, 0px) scalex(2);
	-moz-transform: translate(0px, 0px) scalex(2);
	-o-transform: translate(0px, 0px) scalex(2);
	-webkit-transform-origin: right;
	-moz-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
}
}