@charset "utf-8";

body,p,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,th,td {
	margin: 0;
	padding: 0;
}

address,em {
font-style: normal;
}
strong,th {
font-weight: normal;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}

img {
max-width: 100%;
height: auto;
width /***/:auto;
border: 0;
vertical-align: bottom;

}

li {
list-style-type: none;
}

a {
text-decoration: none;
}
a:link { color: #6495ed;
}


/*----------------------------------------------------------
  レイアウト関係
----------------------------------------------------------*/

/*---------------------------------フォントサイズなど*/
body {
  font-size: 100%;
  font-family: Verdana,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',osaka, 'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  margin: 0;
  padding: 0;
  background-color: #ffffff;
}

/*---------------------------------ページ全体の横幅*/
#wrapper {
  width: 100%;
  margin: 0px auto 0px auto;
  padding: 0px 0px 0px 0px;
}

#contents {
  width:100%;
  margin: 80px auto 0px auto;
  padding: 0px 0px 0px 0px;
  border: 0px solid #ffffff;
}

/*---------------------------------mons_pc*/
.confirm {
  width: 400px;
  margin: 0px auto 30px auto;	
  text-align: center;
  font-size: 150%;
  background: -moz-linear-gradient(top,#0099CC 0%,#006699);
  background: -webkit-gradient(linear, left top, left bottom, from(#0099CC), to(#006699));
  border: 1px solid #DDD;
}

.confirm a {
  display: block;
  padding: 20px 0px 20px 0px;
  color:#ffffff;
}

.confirm_g {
  width: 400px;
  margin: 0px auto 30px auto;	
  text-align: center;
  font-size: 150%;
  background: -moz-linear-gradient(top,#0099CC 0%,#006699);
  background: -webkit-gradient(linear, left top, left bottom, from(#0099CC), to(#006699));
  border: 1px solid #DDD;
}

.confirm_g a {
  display: block;
  padding: 20px 20px 20px 20px;
  color:#ffffff;
}

.sml {
  font-size: 80%;
}

/*---------------------------------レスポンス*/


@media only screen and (max-width: 950px) {

#sect_3_right {
  width: 57%;
}

#sect_3_left {
  width: 31%;
}
}

@media only screen and (max-width: 880px) {

#sect_3_right {
}

.tex1 {
  font-weight: 850; 
  font-size: 230%;
}

.tex2 {
  font-weight: 850; 
  font-size: 250%;
}

.tex3 {
  font-weight: 850; 
  font-size: 120%;
}

}


@media only screen and (max-width: 768px) {

#menu li{
  width: 25%;
  border-bottom: 0px solid #444;
}

.logo {
  width: 19%;
  float: left;
  text-align: left;
  margin: 0px 0px 0px 10px;
  padding: 10px 0px 10px 0px;
  background-color: #ffffff;border: 0px solid #ff0000;vertical-align: bottom;
}

h1 {
  width: 75%;
  float: right;
  text-align: right;
  margin: 5px 10px 0px 0px;
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;border: 0px solid #00ff00;
  font-size: 70%;
}

#sect_1_right {
  width: 54%;
  font-size: 85%;
}

.tex1 {
  font-weight: 800; 
  font-size: 200%;
}

.tex2 {
  font-weight: 800; 
  font-size: 220%;
}

.tex3 {
  font-weight: 800; 
  font-size: 110%;
}

#sect_3_right {
  width: 65%;
  font-size: 130%;
}
}

@media only screen and (max-width: 640px) {

#menu{
  display: none;
}

#contents_pc {
  display: none;
}

#contents_smp {
  display: block;
}

#menu li{
  width: 100%;

}


#toggle{
  display: block;
  position: relative;
  width: 100%;
  background: #222;
}

#toggle a{
  width: 100%;
  margin: 0px auto 0px auto;
  display: block;
  position: relative;
  padding: 12px 0 10px;
  border-bottom: 1px solid #444;
  color: #fff;
  text-align: center;
  text-decoration: none;
}

#toggle:before{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  background: #fff;
}

#toggle a:before, #toggle a:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  width: 20px;
  height: 4px;
  background: #222;
}

#toggle a:before{
  margin-top: -6px;
}

#toggle a:after{
  margin-top: 2px;
}

.logo {
  width: 184px;
  float: left;
  text-align: left;
  margin: 0px 0px 0px 10px;
  padding: 10px 0px 10px 0px;
  background-color: #ffffff;border: 0px solid #ff0000;vertical-align: bottom;
}

h1 {
  width: 65%;
  float: right;
  text-align: right;
  margin: 5px 10px 0px 0px;
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;border: 0px solid #00ff00;
  font-size: 70%;
}

#sect_1 {
  width: 100%;
  
  margin: 0px auto 30px auto;
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;
  overflow: hidden;
  border: 0px solid #C82C55;
}

#sect_1_left {
  width: 100%;
 
  float: none;
  margin: 0px auto 20px auto;
  
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;
  text-align: center;border: 0px solid #00ff00;
}

#sect_1_right {
  width: 88%;
  float: none;
  margin: 0px auto 0px auto;
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;
  text-align: left;border: 0px solid #000000;
  line-height: 180%;
}

#catch {
  margin-bottom: 50px;
}

#st_obj {
  margin-bottom: 50px;
}

#sect_btn {
  margin-bottom: 80px;
}

#line {
 margin-bottom: 50px;
}

#footer {
  padding-top: 50px;
}

.tex1 {
  font-weight: 780; 
  font-size: 135%;
  position: absolute;
  top: 29%;
  left: 15.3%;
}

.tex2 {
  font-weight: 750; 
  font-size: 130%;
  position: absolute;
  top: 50%;
  left: 15.3%;
}

.tex3 {
  font-weight: 600; 
  font-size: 70%;
  top: 85%;
left: 81.63%;
}

#sect_3_right {
  font-size: 70%;
}
.confirm {
  width: 100%;
  height: 100%;
  margin: 0px auto 30px auto;	
  text-align: center;
  font-size: 150%;
  background: -moz-linear-gradient(top,#0099CC 0%,#006699);
  background: -webkit-gradient(linear, left top, left bottom, from(#0099CC), to(#006699));
  border: 1px solid #DDD;
}

.confirm a {
  display: block;
  padding: 20px 0px 20px 0px;
  color:#ffffff;
}

.confirm_g {
  width: 100%;
  height: 100%;
  margin: 0px auto 30px auto;	
  text-align: center;
  font-size: 150%;
  background: -moz-linear-gradient(top,#0099CC 0%,#006699);
  background: -webkit-gradient(linear, left top, left bottom, from(#0099CC), to(#006699));
  border: 1px solid #DDD;
}

.confirm_g a {
  display: block;
  padding: 20px 20px 20px 20px;
  color:#ffffff;
}

}
