@charset "UTF-8";

/* =====================
  main
===================== */
#main {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 75% 0 0;
}
#main .main_inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:  #b40d0d;
}
#main .main_inner img {
	height: 100%;
}
/* アニメーション */
.fade-in {
  transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
}
#main h1 {
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
}
#main div {
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
}
/* =====================
  sns_share
===================== */
.sns_share {
	text-align: center;
	margin: 40px 0 0 0;
}
.sns_share li {
	display: inline-block;
}
.sns_share li:first-child {
	margin: 0 10px 0 0;
}
@media (max-width: 640px) {
.sns_share {
	text-align: center;
	margin: 20px 0 0 0;
}
.sns_share li {
	display: inline-block;
	width: 41%;
	vertical-align:  top;
}
.sns_share li:first-child {width: 30%;}
}
/* =====================
  about
===================== */
.about {
	position: relative;
	margin: 70px auto 0;
	width: 1153px;
	left: -22px;
}
.about .bg {
	margin: 0 auto;
}
.about h3 {
	position: absolute;
	top: -50px;
	left: 0;
	right: 0;
	width: 651px;
	margin: 0 auto;
}
.about h4 {
	position: absolute;
	top: 120px;
	right: 40px;
}
.about p {
	position: absolute;
	top: 270px;
	right: 420px;
	font-size: 16px;
	line-height: 25px;
	font-weight: bold;
}
.about .kouzuma {
	display: none;
}
.about ul {
	position: absolute;
	text-align: center;
	top: 390px;
	right: 140px;
}
.about ul li {
	display: inline-block;
}
.about ul li:first-child {
	margin: 0 20px 0 0;
}
@media (max-width: 640px) {
.about {
	position: relative;
	width: inherit;
	left: 0;
	margin: 70px 15px 15px 15px;
	background: #fef347;
	/* overflow:  hidden; */
	display: block;
	border: 4px solid #1a1a1a;
	padding: 0 0 20px 0;
}
.about .bg {
	margin: 0 auto;
}
.about h3 {
	position: inherit;
	top: 0;
	left: 0;
	right: 0;
	width: inherit;
	margin: -50px auto 0;
}
.about h4 {
	position: inherit;
	top: 0;
	right: 0;
	left: 0;
	margin: 0 auto;
	width: 100%;
	background: url(../images/about/ttl_h4_bg_sp.png) no-repeat;
	background-size: cover;
	padding: 20px 0;
}
.about h4 img {
	width: 90%;
	margin: 0 auto;
}
.about p {
	position: inherit;
	top: 0;
	right: 0;
	font-size: 16px;
	line-height: 25px;
	font-weight: bold;
	left: 0;
	text-align: center;
	padding: 20px 0;
}
.about .kouzuma {
	display: block;
	position: inherit;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 0 0 20px;
	width: 80%;
}
.about ul {
	position: inherit;
	text-align: center;
	top: 0;
	right: 0;
}
.about ul li {
	display: inline-block;
	width: 85%;
	margin: 0 0 10px 0;
}
.about ul li:first-child {
	margin: 0 0 10px 0;
}
}
/* =====================
  planning
===================== */
#planning_sp {
	display: none;
}
#planning {
	padding: 63px 0 26px 0;
	background-image: url(../images/planning/bg_top.png), url(../images/planning/bg_bottom.png);
	background-position: top, bottom;
	background-repeat: no-repeat, no-repeat;
	position: relative;
	top: -10px;
	z-index: 2;
}
#planning .planning {
	width: 1104px;
	background-image: url(../images/planning/bg_center.png);
	background-position: center;
	background-repeat: repeat-y;
	margin: 0 auto;
	height: 1897px;
}
#planning .planning .box {
	position: relative;
}
#planning .planning .h3_style01 {
	position: absolute;
	top: -20px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	width: 1023px;
}
@media (max-width: 640px) {
#planning {
	display: none;
}
#planning_sp {
	padding: 20px 0 0 0;
	background: #FFF;
	border: 4px solid #1a1a1a;
	z-index: 2;
	display: block;
	margin: 0 15px 0 15px;
}
#planning_sp .planning {
	width: inherit;
	margin: -36px auto 0;
}
#planning_sp .planning .box {
	position: relative;
}
#planning .planning .h3_style01 {
	position: absolute;
	top: -20px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	width: inherit;
}
}
/* 
  box01
-------------------------- */
#planning .planning .box01 {
	position: absolute;
	top: 260px;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 629px;
	overflow: hidden;
	width: auto;
	width: 1104px;
}
#planning .planning .box01 h4 img {
	position: absolute;
	top: 0;
	left: -5px;
	right: 0;
	margin: 0 auto;
	width: 1054px;
}
#planning .planning .box01 div {
	position: absolute;
	top: 96px;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 700px;
	overflow: hidden;
	width: auto;
	width: 1104px;
}
#planning .planning .box01 div img:nth-of-type(1) {
	position: absolute;
	top: 9px;
	left: -5px;
	right: 0;
	margin: 0 auto;
	overflow: hidden;
	width: auto;
	width: 1054px;
}
#planning .planning .box01 div img:nth-of-type(2) {
	position: absolute;
	top: 27px;
	left: 6px;
	right: 0;
	overflow: hidden;
	width: auto;
	width: 238px;
}
@media (max-width: 640px) {
#planning_sp .planning .box01 {
	overflow: hidden;
	width: 95%;
	margin:  0 auto;
	padding: 0 1% 0 0;
}
#planning_sp .planning .box01 h4 img {
	margin: 0 auto;
	width: 100%;
}
#planning_sp .planning .box01 div {
	margin: -11px auto;
	overflow: hidden;
	width: 100%;
	padding: 0 0 11px 0;
}
#planning_sp .planning .box01 div img:nth-of-type(1) {
	overflow: hidden;
	width: 100%;
}
#planning_sp .planning .box01 div img:nth-of-type(2) {
	position: absolute;
	top: 27px;
	left: 6px;
	right: 0;
	overflow: hidden;
	width: auto;
	width: 238px;
}
}
/* 
  box02
-------------------------- */
#planning .planning .box02 {
	display: none;
}
@media (max-width: 640px) {
}
/* 
  box03
-------------------------- */
#planning .planning .box03 {
	position: absolute;
	top: 831px;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 1140px;
	overflow: hidden;
	width: auto;
	width: 1104px;
}
#planning .planning .box03 h4 img {
	position: absolute;
	top: 8px;
	left: -5px;
	right: 0;
	margin: 0 auto;
	width: 1054px;
}
#planning .planning .box03 div {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 1140px;
	overflow: hidden;
	width: auto;
	width: 1104px;
}
#planning .planning .box03 div img:nth-of-type(1) {
	position: absolute;
	top: 136px;
	left: 23px;
	right: 0;
	overflow: hidden;
	width: auto;
	width: 726px;
}
#planning .planning .box03 div img:nth-of-type(2) {
	position: absolute;
	top: 19px;
	right: 30px;
	overflow: hidden;
	width: auto;
	width: 411px;
}
#planning .planning .box03 div img:nth-of-type(3) {
	position: absolute;
	top: 453px;
	left: -1px;
	right: 0;
	overflow: hidden;
	width: auto;
	width: 1054px;
	margin: 0 auto;
}
#planning .planning .box03 div img:nth-of-type(4) {
	position: absolute;
	top: 770px;
	left: -1px;
	right: 0;
	overflow: hidden;
	width: auto;
	width: 1054px;
	margin: 0 auto;
}
@media (max-width: 640px) {
#planning_sp .planning .box03 {
	overflow: hidden;
	width: 95%;
	margin: 5px auto;
	padding: 0 1% 30px 0;
}
#planning_sp .planning .box03 h4 img {
	margin: 0 auto;
	width: 100%;
}
#planning_sp .planning .box03 div {
	margin: -14px auto;
	overflow: hidden;
	width: 100%;
	padding: 0 0 0 0;
}
#planning_sp .planning .box03 div img:nth-of-type(1) {
	overflow: hidden;
	width: 100%;
	margin: 0 0 1.5% 0;
}
#planning_sp .planning .box03 div img:nth-of-type(2) {
	position: inherit;
	overflow: hidden;
	width: inherit;
}
#planning_sp .planning .box03 div img:nth-of-type(3) {
	position: inherit;
	overflow: hidden;
	width: inherit;
	margin: 5px 0 0 0;
}
}

/* =====================
  support
===================== */
.support {
	background:url(../images/support/bg.png) no-repeat;
	background-size:  cover;
	background-position:  center;
	text-align:  center;
	position:  relative;
	margin: -50px 0 0 0;
	z-index: 1;
}
.support img {
	width: 1072px;
	margin: 0 auto;
	margin-left:  auto;
	margin-right: auto;
}
@media (max-width: 640px) {
.support {
	background:url(../images/support/bg.png) no-repeat;
	background-size:  cover;
	background-position:  center;
	text-align:  center;
	margin: 0 0 0 0;
	z-index: 1;
}
.support img {
	width: 100%;
	margin: 0 auto;
	margin-left:  auto;
	margin-right: auto;
}
}


/* =====================
  package
===================== */
.package_wrap {
	padding: 63px 0 43px 0;
	background-color: #58A3DA;
	top: -10px;
	z-index: 2;
	height: 740px;
}
.package {
	width: 1104px;
	background-image: url(../images/package/bg_top.png), url(../images/planning/bg_bottom.png);
	background-position: top, bottom;
	background-repeat: no-repeat, no-repeat;
	margin: 0 auto;
	height: 651px;
	position: relative;
	padding: 15px 0;
}
.package .inner {
	width: 1104px;
	background-image: url(../images/planning/bg_center.png);
	background-position: center;
	background-repeat: repeat-y;
	height: 640px;
}
.package h4 {
	position: absolute;
	top: 30px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 1055px;
}
.package .inner div {
	position: absolute;
	top: 133px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 1052px;
	overflow:  hidden;
}
.package .inner ul {
    margin-left: 1em;
    position: absolute;
    top: 520px;
    left:  0;
    right:  0;
    margin: 0 auto;
    width: 610px;
}
.package .inner ul li {
    text-indent: -1em;
    margin-left: 1em;
    line-height: 31px;
    font-weight:  bold;
    font-size: 18px;
    position:  relative;
}
.package .inner ul li:before {
    content: '※';
    display: inline-block;
    width: 1em;
    text-indent: 0;
    top: 1px;
    position:  absolute;
    left: -38px;
    font-size: 13px;
}
@media (max-width: 640px) {
.package_wrap {
	padding: 63px 0 43px 0;
	background-color: #58A3DA;
	top: 0;
	z-index: 2;
	height: inherit;
}
.package {
	width: inherit;
	background-image: none;
	margin: 0 auto;
	height: inherit;
	position: inherit;
	padding: 4px 0 6px 0;
	margin: 0 10px 0 15px;
}
.package .inner {
	width: inherit;
	background: #FFF;
	border: 4px solid #1a1a1a;
	height: inherit;
	padding: 20px 0;
}
.package h4 {
	position: inherit;
	0: 0
	right: 0;
	margin: 0 auto;
	width: 95%;
}
.package .inner div {
	position: inherit;
	top: 0;
	left: 0;
	right: 0;
	margin: -10px auto;
	width: 95%;
	overflow:  hidden;
}
.package .inner ul {
    margin-left: 0;
    position: inherit;
    top: 0;
    left:  0;
    right:  0;
    margin: 25px 15px 0 30px;
    width: inherit;
}
.package .inner ul li {
    text-indent: 0;
    margin-left: 0;
    line-height: 24px;
    font-weight:  bold;
    font-size: 16px;
    position:  relative;
    margin: 0 0 10px 0;
}
.package .inner ul li:before {
    content: '※';
    display: inline-block;
    width: 1em;
    text-indent: 0;
    top: 1px;
    position:  absolute;
    left: -15px;
    font-size: 13px;
}
}


/* =====================
  contact
===================== */
#contact.contact_wrap {
	background: #F9D137;
	padding: 50px 0;
}
#contact .contact {
	width: 834px;
	margin: 0 auto;
	border: 3px solid #000000;
	background: #FFF;
	padding: 60px 80px;
}
#contact .contact h3 {
	font-size: 32px;
	text-align: center;
	font-weight: bold;
}
#contact .contact p {
	text-align: center;
	padding: 20px 0 30px 0;
}
@media (max-width: 640px) {
#contact.contact_wrap {
	background: #F9D137;
	padding: 50px 0;
}
#contact .contact {
	width: inherit;
	margin: 0 15px;
	border: 3px solid #000000;
	background: #FFF;
	padding: 60px 20px;
}
#contact .contact h3 {
	font-size: 32px;
	text-align: center;
	font-weight: bold;
}
#contact .contact p {
	text-align: center;
	padding: 20px 0 30px 10px;
}
}

/* 
  table
-------------------------- */
#contact table {
}
#contact table input, #contact table textarea {
	border: 2px solid #000000;
	padding: 5px;
	font-size: 18px;
	width: 100%;
}
#contact table th, #contact table td {
	padding: 15px 0;
}
#contact table th {
	text-align: left;
	font-size: 18px;
	vertical-align: top;
}
#contact table td {
	text-align: left;
}
#contact table td li {
	display: inline-block;
	width: 20%
}
#contact table td li:first-child {
	margin: 0 20px 0 0;
}
#contact table td li input, #contact table td li p {
	display: inline-block;
}
#contact table td li input{
	width: 70%;
}
#contact table .hissu {
	background: #D53E2F;
	color: #FFF;
	padding: 3px 10px;
	font-size: 14px;
	margin: 0 0 0 5px;
}
@media (max-width: 640px) {
#contact table {width: inherit;margin: 0 auto;}
#contact table input, #contact table textarea {
	border: 2px solid #000000;
	padding: 5px;
	font-size: 18px;
	width: 95%;
	display: block;
}
#contact table th, #contact table td {
	padding: 15px 0;
}
#contact table th {
	text-align: left;
	font-size: 18px;
	vertical-align: top;
	display: block;
	width: 100%;
	padding: 15px 0 0 0;
}
#contact table td {
	text-align: left;
	display:  block;
	padding: 15px 0 10px 0;
}
#contact table td li {
	display: inline-block;
	width: 36%;
}
#contact table td li:first-child {
	margin: 0 20px 0 0;
	width: 36%;
	display: inline-block;
}
#contact table td li input, #contact table td li p {
	display: inline-block;
}
#contact table td li input{
	width: 45%;
}
#contact table .hissu {
	background: #D53E2F;
	color: #FFF;
	padding: 3px 10px;
	font-size: 14px;
	margin: 0 0 0 5px;
}
}

/* iframe */
#contact iframe {
	width: 752px;
	margin: 30px auto;
	border: 1px solid #B3B3B3;
	display: block;
}
@media (max-width: 640px) {
#contact iframe {
	width: inherit;
	margin: 30px auto 0;
	border: 1px solid #B3B3B3;
	display: block;
}
}

/* button */
#contact #submit_button {
	position: relative;
	width:  245px;
	margin: 0 auto 30px;
	padding: 0;
}
#contact #submit_button input {
	background: #D53E2F;
	color: #FFF;
	padding: 10px 100px;
	font-size: 22px;
	border-radius: 10px;
	border-color: initial;
	position: relative;
	webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
	-moz-border-radius: 10px; /* Firefox用 */  
}
#contact #submit_button:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	background: #fff;
	z-index: 1;
}
#contact #submit_button:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 0;
	height: 0;
	margin-top: -5px;
	border: 5px solid transparent;
	border-left: 5px solid #D53E2F;
	z-index: 1;
}
#contact #submit_button input:hover {
	background: #E68B82;
}
#contact #submit_button:hover {
	background: #FFF;
}
#contact #submit_button:hover:after {
	border-left: 5px solid #E68B82;
}
@media (max-width: 640px) {
#contact #submit_button {
	position: relative;
	width:  245px;
	margin: 0 auto 30px;
	padding: 0;
}
#contact #submit_button input {
	background: #D53E2F;
	color: #FFF;
	padding: 10px 100px;
	font-size: 22px;
	border-radius: 10px;
	border-color: initial;
	position: relative;
	webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
	-moz-border-radius: 10px; /* Firefox用 */  
}
#contact #submit_button:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	background: #fff;
	z-index: 1;
}
#contact #submit_button:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 0;
	height: 0;
	margin-top: -5px;
	border: 5px solid transparent;
	border-left: 5px solid #D53E2F;
	z-index: 1;
}
#contact #submit_button input:hover {
	background: #E68B82;
}
#contact #submit_button:hover {
	background: #FFF;
}
#contact #submit_button:hover:after {
	border-left: 5px solid #E68B82;
}
}


/* =====================
  privacy
===================== */
#privacy {
	padding: 25px 30px;
}
#privacy h3 {
	font-size: 16px;
	border-bottom: 2px solid #B3B3B3;
	padding: 0 0 5px 10px;
	margin: 0 0 10px 0;
}
#privacy p {
	font-size: 13px;
	line-height: 25px;
	padding: 10px 0;
}
#privacy ul {
}
#privacy ul li {
	font-size: 13px;
	line-height: 25px;
	text-align: left;
}
#privacy .textleft {
	text-align: left;
	margin: 15px 0 0 0;
}
@media (max-width: 640px) {
.iframe-wrapper {
  width: 100%;
   */
}
.iframe {
  width: 100%;
  height: 100%;
}
#privacy {
	padding: 25px 30px;
}
#privacy h3 {
	font-size: 16px;
	border-bottom: 2px solid #B3B3B3;
	padding: 0 0 5px 10px;
	margin: 0 0 10px 0;
}
#privacy p {
	font-size: 13px;
	line-height: 25px;
	padding: 10px 0;
}
#privacy ul {
}
#privacy ul li {
	font-size: 13px;
	line-height: 25px;
	text-align: left;
}
#privacy .textleft {
	text-align: left;
	margin: 15px 0 0 0;
}
}
