@charset "utf-8";

/* common
---------------------------------------------*/
* {margin:0;padding:0;}

a:link,a:visited {
	color: #0040ff;
	text-decoration:underline;
}
a:hover,a:active {
	color: #fff;
	text-decoration:underline;
}

.impact   {font-size:20pt; font-weight:bold;}
.impact2  {color:red;}
.impact3  {background:yellow; color:#000;}
#impact4  {underline;}
.impact5  {background:#173B50; padding:2px 5px; color:#fff;}
.impact6  {background:#f4f4f4; padding:3px; line-height:1.1;}
.impact7  {background: #B60000; padding:2px 5px; color:#fff;}
.style2   {color: #FF0000}
.style3   {color: #333333}
.style4   {color: #000000}


img{ border: none;}

/* ボタンのマウスオーバーで明るくする */
.btn:hover {
  filter: brightness(120%);
}


/* animation
---------------------------------------------*/
.feedInUp {
	opacity: 0;
	transform: translate(0,30px); 
	-webkit-transform: translate(0,30px); 
	transition: 1.5s;
}
.feedInUp_On {
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* layout
---------------------------------------------*/


/*TopIntro-Start*/
body {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	min-width: 1000px;
	
  background-image: url(../images/bg.jpg);
	background-repeat: repeat;
	background-attachment: fixed;
	background-position: top center;
	
-webkit-text-size-adjust:none;
	
  text-align:center;
  font-size:20px;
  font-family: 'meiryo', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    color: #202020;
}

#headpc1 { background: url("../images/headpc_01.png") no-repeat top center; height:    109px; } 
#headpc2 { background: url("../images/headpc_02.png") no-repeat top center; height:    210px; } 
#headpc3 { background: url("../images/headpc_03.png") no-repeat top center; height:    143px; } 
#headpc4 { background: url("../images/headpc_04.png") no-repeat top center; height:    150px; } 
#headpc5 { background: url("../images/headpc_05.png") no-repeat top center; height:    116px; } 
#headpc6 { background: url("../images/headpc_06.png") no-repeat top center; height:    258px; } 

#head1 { background: url("../images/head_01.png") no-repeat top center; height:    243px; } 
#head2 { background: url("../images/head_02.png") no-repeat top center; height:    335px; } 
#head3 { background: url("../images/head_03.png") no-repeat top center; height:    122px; } 
#head4 { background: url("../images/head_04.png") no-repeat top center; height:    212px; } 
#head5 { background: url("../images/head_05.png") no-repeat top center; height:    288px; } 
#head6 { background: url("../images/head_06.png") no-repeat top center; height:    482px; } 

#head7 { background: url("../images/head_07.png") no-repeat top center; height:    1486px; } 
#head8 { background: url("../images/head_08.png") no-repeat top center; height:    1348px; } 
#head9 { background: url("../images/head_09.png") no-repeat top center; height:    2170px; } 

#head11 { background: url("../images/head_11.png") no-repeat top center; height:    643px; } 
#head12 { background: url("../images/head_12.png") no-repeat top center; height:    98px; } 
#head13 { background: url("../images/head_13.png") no-repeat top center; height:    98px; } 

#head16 { background: url("../images/head_16.png") no-repeat top center; height:    1972px; } 

#head19 { background: url("../images/head_19.png") no-repeat top center; height:    1360px; } 
#head20 { background: url("../images/head_20.png") no-repeat top center; height:    1031px; } 
#head21 { background: url("../images/head_21.png") no-repeat top center; height:    1252px; } 

#headb_1 { background: url("../images/head_b_01.png") no-repeat top center; height:    1498px; } 

#headb_4 { background: url("../images/head_b_04.png") no-repeat top center; height:    1077px; } 

#headb_6 { background: url("../images/head_b_06.png") no-repeat top center; height:    1077px; } 

#headb_8 { background: url("../images/head_b_08.png") no-repeat top center; height:    1086px; } 

#headb_10 { background: url("../images/head_b_10.png") no-repeat top center; height:    1141px; } 

#headb_12 { background: url("../images/head_b_12.png") no-repeat top center; height:    1420px; } 

#headb_15 { background: url("../images/head_b_15.png") no-repeat top center; height:    1086px; } 

#headc_2 { background: url("../images/head_c_02.png") no-repeat top center; height:    1809px; } 
#headc_3 { background: url("../images/head_c_03.png") no-repeat top center; height:    1916px; } 

#headc_6 { background: url("../images/head_c_06.png") no-repeat top center; height:    793px; } 

#headc_9 { background: url("../images/head_c_09.png") no-repeat top center; height:    975px; } 

#headc_12 { background: url("../images/head_c_12.png") no-repeat top center; height:    1841px; } 

#headc_15 { background: url("../images/head_c_15.png") no-repeat top center; height:    1093px; } 
#headc_16 { background: url("../images/head_c_16.png") no-repeat top center; height:    193px; } 
#headc_17 { background: url("../images/head_c_17.png") no-repeat top center; height:    241px; } 

#headc_20 { background: url("../images/head_c_20.png") no-repeat top center; height:    178px; } 

#headc_23 { background: url("../images/head_c_23.png") no-repeat top center; height:    100px; } 
#headc_24 { background: url("../images/head_c_24.png") no-repeat top center; height:    2030px; } 
#headc_25 { background: url("../images/head_c_25.png") no-repeat top center; height:    193px; } 
#headc_26 { background: url("../images/head_c_26.png") no-repeat top center; height:    883px; } 
#headc_29 { background: url("../images/head_c_29.png") no-repeat top center; height:    90px; } 

#headd_2 { background: url("../images/head_d_02.png") no-repeat top center; height:    494px; } 

#headd_5 { background: url("../images/head_d_05.png") no-repeat top center; height:    453px; } 
#headd_6 { background: url("../images/head_d_06.png") no-repeat top center; height:    251px; } 

#headd_9 { background: url("../images/head_d_09.png") no-repeat top center; height:    169px; } 
#headd_10 { background: url("../images/head_d_10.png") no-repeat top center; height:    296px; } 

#heade_2 { background: url("../images/head_e_02.png") no-repeat top center; height:    1151px; } 
#heade_4 { background: url("../images/head_e_04.png") no-repeat top center; height:    91px; } 

#headf_2 { background: url("../images/head_f_02.png") no-repeat top center; height:    1741px; } 
#headf_3 { background: url("../images/head_f_03.png") no-repeat top center; height:    836px; } 

#headf_6 { background: url("../images/head_f_06.png") no-repeat top center; height:    76px; } 
#headf_7 { background: url("../images/head_f_07.png") no-repeat top center; height:    815px; } 

#headf_9 { background: url("../images/head_f_09.png") no-repeat top center; height:    171px; } 
#headff_2 { background: url("../images/head_ff_02.png") no-repeat top center; height:    1741px; } 

#form { background: url("../images/form.png") no-repeat top center; height:    195px; } 
#form_area { background: url("../images/form_area.png") no-repeat top center; height:   110px; } 

#pointer {
    cursor: pointer;
}

/*キラリボタン*/
.reflection_btn{
    width       :147px;
    height      :147px;
    position    :relative;
    overflow    :hidden;
    margin: auto;
    border-radius: 100px !important;
    z-index: 999; 
}

.reflection_btn2{
    width       :925px;
    height      :179px;
    position    :relative;
    overflow    :hidden;
    margin: auto;
    border-radius: 17px !important;
    z-index: 999; 
}

 
.reflection {
    
    height      :80%;
    width       :30px;
    position    :absolute;
    top         :-180px;
    left        :0;
    background-color: #fff;
    opacity     :0;
    transform: rotate(45deg);
    animation: reflection 2s ease-in-out infinite;
    -webkit-transform: rotate(45deg);
    -webkit-animation: reflection 2s ease-in-out infinite;
    -moz-transform: rotate(45deg);
    -moz-animation: reflection 2s ease-in-out infinite;
    -ms-transform: rotate(45deg);
    -ms-animation: reflection 2s ease-in-out infinite;
    -o-transform: rotate(45deg);
    -o-animation: reflection 2s ease-in-out infinite;
}
 
@keyframes reflection {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    80% { transform: scale(0) rotate(45deg); opacity: 0.3; }
    81% { transform: scale(4) rotate(45deg); opacity: 0.8; }
    100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.3; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 0.8; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
    0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.3; }
    81% { -moz-transform: scale(4) rotate(45deg); opacity: 0.8; }
    100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
    0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.3; }
    81% { -ms-transform: scale(4) rotate(45deg); opacity: 0.8; }
    100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
    0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -o-transform: scale(0) rotate(45deg); opacity: 0.3; }
    81% { -o-transform: scale(4) rotate(45deg); opacity: 0.8; }
    100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}

.example{
    text-decoration: underline;
    color: blue;
}

/* qa */
.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_qa .cp_actab {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0 0 1em 0;
	color: #202020;
}
.cp_qa .cp_actab input {
	position: absolute;
	opacity: 0;
}
/* 質問 */
.cp_qa .cp_actab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 1em 2em 1em 2.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27,37,56,0.1);
}
.cp_qa .cp_actab label::before {
	font-family: serif;
	font-size: 1.5em;
	color: #3a85fe;
	margin-left: -2em;
	padding-right: 0.5em;
	content: 'Q';
}
.cp_qa .cp_actab label:hover {
	transition: all 0.3s;
	color: #3a85fe;
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after {
	font-size: 1.7em;
	font-weight: bold;
	line-height: 2em;
	position: absolute;
	top: 0;
	right: 0;
	content: '+';
	display: inline-block;
	width: 2em;
	height: 2em;
	-webkit-transition: transform 0.4s;
	        transition: transform 0.4s;
}
/* 答え */
.cp_qa .cp_actab .cp_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0.5em 0.5em;
}
.cp_qa .cp_actab .cp_actab-content::before {
	font-family: serif;
	font-size: 1.5em;
	color: #cd60ff;
	position: absolute;
	margin: 0.4em 0 0 -1em;
	padding: 0;
	content: 'A';
}
.cp_qa .cp_actab .cp_actab-content p {
	margin: 1em 1em 1em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .cp_actab input:checked ~ .cp_actab-content {
	max-height: 40em;
	border: 10px solid rgba(27,37,56,0.1);
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa .cp_actab input:checked ~ label {
	color: #5564fe;
	border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa .cp_actab input[type=checkbox]:checked + label::after {
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
/* おわり */
#wrap {

	background-image: url("../images/wrap.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap2 {

	background-image: url("../images/wrap2.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap3 {

	background-image: url("../images/wrap3.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap4 {

	background-image: url("../images/wrap4.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap5 {

	background-image: url("../images/wrap5.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap6 {

	background-image: url("../images/wrap6.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap7 {

	background-image: url("../images/wrap7.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap8 {

	background-image: url("../images/wrap8.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap9 {

	background-image: url("../images/wrap9.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap10 {

	background-image: url("../images/wrap10.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap11 {

	background-image: url("../images/wrap11.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap12 {

	background-image: url("../images/wrap12.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap13 {

	background-image: url("../images/wrap13.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap14 {

	background-image: url("../images/wrap14.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap15 {

	background-image: url("../images/wrap15.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap16 {

	background-image: url("../images/wrap16.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap17 {

	background-image: url("../images/wrap17.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}
#wrap20 {

	background-image: url("../images/wrap20.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}

#wrapform {

	background-image: url("../images/wrapform.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-position:50% 0%;
}


#container {

	text-align:left;
	width:1000px;
	margin:0 auto;
	
	
}

#text {

	text-align:left;
	width:850px;
	margin:0 auto;
	
	
}
#text2 {

	text-align:left;
	width:850px;
	margin:0 auto;
	font-size: 16px;
	
	
}
#text3 {

	text-align:left;
	width:850px;
	margin:0 auto;
	font-size: 13px;
	
	
}

#textwhite {

	text-align:left;
	width:850px;
	margin:0 auto;
	color: #fff;
	
}

#texts2 {

	text-align:left;
	width:750px;
	position: relative;
	margin-top:170px;
	margin-left:400px;
	
	
}

#texts3 {

	text-align:left;
	width:850px;
	margin-top:250px;
	margin-left:170px;
	
	
}


.container {

	text-align:left;
	width:1200px;
	margin:0 auto;
	
	
}

.white {
  color: #fff;
}

.text-center {
　text-align: center;
}

#footer {  
	background-color: #f2f2f2;
	font-size: 12px;
}
#footer a{
	color: #3a85fe;
	}
--------------------------- */

ol,
ul{
	list-style-position: inside;
	padding-left:10px;
}
ol li,
ul li{
	text-align:left;
}

.side {
	position: fixed;
	position: fixed;
	right: 70px;
	bottom: 0px;
	z-index: 9999999;
  }
  
  .side a img:hover {
	opacity: 1;
  }
  
  .formBtn{display: block;
	  margin: 35px auto;
  -webkit-animation-name:; /* fuwafuwaっていうアニメーションをしてね！ */
	  -webkit-animation-duration:2s;
	  -webkit-animation-iteration-count:infinite;
	  /*-webkit-animation-direction:alternate;*/
	  -webkit-animation-timing-function:ease;
	  
	  -moz-animation-name:fuwafuwa;
	  -moz-animation-duration:2s;
	  -moz-animation-iteration-count:infinite;
	  /*-moz-animation-direction:alternate;*/
	  -moz-animation-timing-function:ease;}
  
  /*ボタンの動きのcss*/
  @-webkit-keyframes fuwafuwa {
	  0% {-webkit-transform:translate(0, 0);}
	  50% {-webkit-transform:translate(0, -10px);}
	  100% {-webkit-transform:translate(0, 0);}
  }
  @-moz-keyframes fuwafuwa {
	  0% {-moz-transform:translate(0, 0);}
	  50% {-moz-transform:translate(0, -10px);}
	  100% {-moz-transform:translate(0, 0);}
  }
  

  .form-group input[type="text"] {
	display: block;
	margin: 0 auto 20px;
	padding: .6em .6em;
	height: 1em;
	width: 70%;
	border: 1px solid #999;
	background-color: #fff;
	color: #666;
	text-align: center;
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

   .form-group input[type="email"] {
	display: block;
	margin: 0 auto 20px;
	padding: .6em .6em;
	height: 1em;
	width: 70%;
	border: 1px solid #999;
	background-color: #fff;
	color: #666;
	text-align: center;
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
  
  
input[type="text"],
input[type="email"],
textarea {
	font-family: monospace;
}

.cl:after,
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

@media(max-width: 768px) {
	html,body{
		width: 100%;
		min-width: 100%;
		font-size: 100%;
		-webkit-text-size-adjust: 100%;
				-ms-text-size-adjust: 100%;
	}
}
