/* =========================================================
common
========================================================= */
/* ---------------------------------------------------------
base
--------------------------------------------------------- */
/* リセット
--------------------------------------------------------- */
/* 要素のフォントサイズやマージン・パディングをリセットしています */
html{ }
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}

/* 行の高さをフォントサイズと同じにしています */
body { line-height: 1; }

/* 新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display: block; }

/* ulのマーカー（行頭記号）を表示しないようにしています */
ol, ul { list-style: none; }

/* a要素のフォントサイズなどをリセットしフォントの縦方向の揃え位置を親要素のベースラインに揃えるようにしています */
a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/* 画像の下に隙間ができてしまうのを防ぎます */
img {
	vertical-align: top;
	font-size: 0;
	line-height: 0;
}

/* 全体に関わるスタイル
--------------------------------------------------------- */
body {
	background-color: #fff;
	color: #222;
	font-family: 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	letter-spacing: 0.1em;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body {
  /* 画像ファイルの指定 */
  background-image: url(../img/bg.jpg);
   
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #464646;
}

body.ver02 {
  /* 画像ファイルの指定 */
  background-image: url(../img/bg02.jpg);
}
body.verEffect {
  /* 画像ファイルの指定 */
  background-image: url(../img/bg_black.jpg);
}
a {
	color: #222;
	text-decoration: none;
}
a:hover { opacity: 0.7; }



.spOnly{ display:none;}

/* ---------------------------------------------------------
footer
--------------------------------------------------------- */
.footer {
	position: relative;
	background-color: #000;
	text-align:center;
}

.footer__copyright {
	color: #fff;
	font-size: 10px;
	line-height:;
	letter-spacing:0.3px;
	padding:20px 0px;
	
}


/* ---------------------------------------------------------
header
--------------------------------------------------------- */
img{ width:100%;}
.header {
	padding: 10px 10px 0px;
	line-height: 0;
	background:#000000;
	overflow:hidden;
	background-image:url(../img/headBg.jpg);
	background-repeat:repeat;
	border-bottom:1px solid #e60012;
	
}
.header .header_animaxBox{
	width:1010px;
	margin:0 auto;
	position:relative;
	overflow:hidden;}
	
.header_logo {
	padding-left:60px;
	width:199px;
	float:left;
	padding-top:7px;
	padding-right:10px;
	padding-bottom:20px;}
.header_news {
	margin-left:px;
	width:479px;
	float:left;
	padding-top:7px;
	padding-right:10px;
	padding-bottom:20px;}
.header_animaxWeb {
	width:183px;
	float:left;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:20px;}
.header_moguro {
	position:absolute;
	right:0px;
	bottom:0px;
	width:5%;
	padding-bottom:0px;
	}		

.header_sns{ float:right; margin-top:10px;}
.header_sns li{ float:left; width:100px; margin-right:10px;}

a:hover { opacity: 1; }




/* ---------------------------------------------------------
section
--------------------------------------------------------- */

.mb50{ margin-bottom:50px !important;}

.line{ background-color:#303030; height:5px; position: relative; }
.line:before {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 50%;
    margin-left: -18px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 20px 18px 0 18px;
    border-color: #303030 transparent transparent transparent;
    z-index: 0;
}
.centerImg{ margin-bottom:30px;}
.centerImgArrow{ margin-bottom:20px;}
.section { position: relative; }

.inner::before {
	content: '';
	position: absolute;
	background-repeat: no-repeat;
}



/* section--lead */
/*.section--main {
	padding: 0px;
	background: linear-gradient(to bottom right, #ff9326, #ff6400);
	color: #fff;
	background-image: url(../img/bg.jpg);
	height:900px;
	background-position:center;
}*/
.section--main .inner{
	width:1050px;
	margin:0 auto;
	position:relative;
	min-height:710px;
	
	}
.section--main .inner .warauLogo{
	position: relative;
	top: 30px;
	left: 0;
	right: 0;
	margin: auto;
	width:20.5%;
	}	
.section--main .inner .moguro{
	position: relative;
	top: 50px;
	left: 0;
	right: 0;
	margin: auto;
	width:60%;
	padding-left:230px;
	}	
.section--main .inner .Box{
	position: relative;
	top: 20px;
	left: 0;
	right: 0;
	margin: 20px auto;
	width:50%;
	background-image:url(../img/boxBg.jpg);
	background-repeat:repeat;
	background-color:#e6e1d0;
	border-radius:10px;
	padding:20px;
	text-align:center;
	
	height:205px;
	margin-bottom:80px;
	}

.section--main .inner .Box .logo02{
	position:absolute;
	top:-150px;
	left:68px;}


.section--main .inner .Box .ttl{
	width:80%;
	
	margin: 75px auto 20px;
	}
	
.section--main .inner .Box .formBox{
	width:75%;
	margin:20px auto;
	overflow:hidden;
	}
.section--main .inner .Box .formBox .nameBox {
	width:65%;
	float:left;
	}	
.section--main .inner .Box .formBox .nameBox input{
	width:100%;
	padding:3%;
	border-radius:5px;
	border:1px solid #ccc;
	}	
.section--main .inner .Box .formBox .btn {
	width:25%;
	float:right;
	}	
input#submit_button {
	border-radius:5px;
	width:100%;
    padding: 13px;
    background-color: #253a61;
    color: #fff;
    border-style: none;
	border:solid 1px #253a61;
}
.section--main .inner .card{
	margin: 40px auto 20px;
	width:35%;
	}

.section--main .inner .coment{
	width:35%;
	border-radius:5px;
	background-color:#253a61;
	color:#fff;
	padding:15px 0px;
	margin:20px auto;
	text-align:center;
	line-height:1.2;
	cursor:pointer;
	}
.section--main .inner .coment02{
	width:35%;
	border-radius:5px;
	background-color:#e60012;
	color:#fff;
	padding:15px 0px;
	margin:20px auto;
	text-align:center;
	line-height:1.2;
	}	
.section--main .inner .sns{
	width:35%;
	margin:0 auto 30px;
	overflow:hidden;
	}		
.section--main .inner .sns .tw{
	float:left;
	width:48%;
	margin-right:2%;
	
	}
.section--main .inner .sns .fb{
	float:right;
	width:48%;
	margin-left:2%;
	
	}	
.sheaComent{
	display:none;}
@media screen and (max-width: 1024px) {
.header_logo {
	padding-left:30px;
	width:199px;
	float:left;
	padding-right:10px;
	padding-bottom:10px;}
.header_news {
	margin-left:px;
	width:479px;
	float:left;
	padding-right:10px;
	padding-bottom:10px;}
.header_animaxWeb {
	width:183px;
	float:left;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:10px;}
.header_moguro {
	position:absolute;
	right:20px;
	bottom:0px;
	width:5%;
	padding-bottom:0px;
	}
.section--main .inner .warauLogo{
	position: relative;
	top: 30px;
	left: 0;
	right: 0;
	margin: auto;
	width:20.5%;
	}

.section--main .inner{
	
	min-height:auto;
	
	}		
.section--main .inner .moguro{
	position: relative;
	top: 50px;
	left: 0;
	right: 0;
	margin: auto;
	width:70%;
	padding-left:230px;
	}	
.section--main .inner .Box{
	position: relative;
	top: 20px;
	left: 0;
	right: 0;
	margin: 120px auto;
	width:75%;
	background-image:url(../img/boxBg.jpg);
	background-repeat:repeat;
	background-color:#e6e1d0;
	border-radius:10px;
	padding:20px;
	text-align:center;
	
	height:280px;
	margin-bottom:30px;
	}

.section--main .inner .Box .logo02{
	width:70%;
	position:absolute;
	top:-200px;
	left:15%;}


.section--main .inner .Box .ttl{
	width:80%;
	margin: 90px auto 20px;
	}

	
.section--main .inner .Box .formBox{
	width:90%;
	margin:0 auto;
	overflow:hidden;
	}
.section--main .inner .Box .formBox .nameBox {
	width:65%;
	float:left;
	}	
	
input#submit_button {
	border-radius:5px;
	width:100%;
    padding: 13px;
    background-color: #253a61;
    color: #fff;
    border-style: none;
	border:solid 1px #253a61;
}

.section--main .inner .card{
	
	width:40%;
	}

.section--main .inner .coment,
.section--main .inner .coment02{
	width:40%;
	
	}
.section--main .inner .sns{
	width:40%;
	
	}		


.sheaComent{
	display:block;
	width:45%;
	margin:0 auto 20px;
	}


}

@media screen and (max-width: 768px) {

body.ver02 {
  /* 画像ファイルの指定 */
  background-image: url(../img/spbg_02.jpg);
}
body.verEffect {
  /* 画像ファイルの指定 */
  background-image: url(../img/bg_black.jpg);
}
	
.section--main .inner{
	width:100%;
	margin:0 auto;
	position:relative;
	overflow:hidden;
	
	}	
.header .header_animaxBox{
	width:100%;
	margin:0 auto;
	position:relative;
	overflow:hidden;}
	
.header_logo {
	padding-left:30px;
	width:20%;
	float:left;
	padding-right:10px;
	padding-bottom:10px;}
.header_news {
	margin-left:px;
	width:47%;
	float:left;
	padding-right:10px;
	padding-bottom:10px;}
.header_animaxWeb {
	width:18%;
	float:left;
	padding-right:10px;
	padding-top:0px;
	padding-bottom:10px;}
.header_moguro {
	position:absolute;
	right:10px;
	bottom:0px;
	width:5%;
	padding-bottom:0px;
	}
.section--main .inner .warauLogo{
	position: relative;
	top: 30px;
	left: 0;
	right: 0;
	margin: auto;
	width:20.5%;
	}	
.section--main .inner .moguro{
	position: relative;
	top: 50px;
	left: 0;
	right: 0;
	margin: auto;
	width:70%;
	padding-left:180px;
	}	
.section--main .inner .Box{
	position: relative;
	top: 20px;
	left: 0;
	right: 0;
	margin: 120px auto;
	width:75%;
	background-image:url(../img/boxBg.jpg);
	background-repeat:repeat;
	background-color:#e6e1d0;
	border-radius:10px;
	padding:20px;
	text-align:center;
	
	height:200px;
	margin-bottom:30px;
	}

.section--main .inner .Box .logo02{
	width:70%;
	position:absolute;
	top:-150px;
	left:15%;}


.section--main .inner .Box .ttl{
	width:80%;
	
	margin: 70px auto 20px;
	}

	
}
@media screen and (max-width: 480px) {
.spOnly{ display:block;}	
.header {
	padding:0px;
	
	line-height: 0;
	overflow:hidden;
}
.header_animaxBox{ padding-top:0px; margin:0 auto 10px; width:100%; overflow:hidden; position:relative; height:105px;}
.header_logo {
	position:absolute;
	padding-left:10px;
	padding-top:10px;
	width:25%;
	float:none;
	padding-bottom:10px;}
.header_news {
	position:absolute;
	bottom:0px;
	width:75%;
	left:15%;
	float:none;
	padding-top:10px;
	
	}
.header_hr{position:absolute; top:50px; display:block; width:100%; height:1px; background-color:#4a4a4a;}
.header_animaxWeb {
	position:absolute;
	right:0px;
	width:25%;
	float:none;
	padding-right:10px;
	padding-top:10px;
	
	padding-bottom:10px;}
.header_moguro {
	position:absolute;
	right:5px;
	bottom:0px;
	width:7%;
	padding-bottom:0px;
	}

.header_sns{ float:none; width:100%; overflow:hidden; margin-top:20px auto; }
.header_sns li{ float:left; width:32%; margin-right:1.5%;}
.header_sns li:last-child{ float:left; width:33%; margin-right:0px;}	
.section--main .inner{
	width:100%;
	margin:0 auto;
	position:relative;
	min-height:auto;
	overflow:hidden;
	margin-bottom:20px;
	
	}
.section--main .inner .warauLogo{
	position: relative;
	top: 10px;
	left: 0;
	right: 0;
	margin: auto;
	width:50%;
	}	
.section--main .inner .moguro{
	position: relative;
	top: 20px;
	left: 0;
	right: 0;
	margin: auto;
	width:90%;
	padding-left:0px;
	}	
.section--main .inner .Box{
	position: relative;
	top: 20px;
	left: 0;
	right: 0;
	margin:20px auto;
	width:80%;
	background-color:#e6e1d0;
	border-radius:10px;
	padding:5%;
	text-align:center;
	height:auto;
	
	}
.section--main .inner .Box .logo02{
	width:70%;
	position:absolute;
	top:-60px;
	left:15%;}


.section--main .inner .Box .ttl{
	width:80%;
	
	margin: 40px auto 20px;
	}	

.section--main .inner .Box .ttl span{
	font-size:120%;
	color:#e60012;
	font-weight:bold;
	}	
.section--main .inner .Box .formBox{
	width:100%;
	margin:0 auto;
	}
.section--main .inner .Box .formBox .nameBox {
	width:65%;
	float:left;
	}	
.section--main .inner .Box .formBox .nameBox input{
	width:100%;
	padding:3%;
	border-radius:5px;
	border:1px solid #ccc;
	}	
.section--main .inner .Box .formBox .btn {
	width:25%;
	float:right;
	}	
input#submit_button {
	border-radius:5px;
	width:100%;
    padding: 9px;
    background-color: #253a61;
    color: #fff;
    border-style: none;
	border:solid 1px #253a61;
}
.section--main .inner .card{
	
	width:60%;
	}

.section--main .inner .coment,
.section--main .inner .coment02{
	
	font-size:14px;
	padding:;
	text-align:center;
	height:32px;
	vertical-align:middle;
	display:table-cell;
	line-height:1.2;
	}
.section--main .inner .comentBox{width:60%;
	margin:0 auto 20px;}
	
.section--main .inner .sns{
	width:60%;
	
	}		


.sheaComent{
	display:block;
	width:70%;
	margin:0 auto 20px;
	}	
		
}
