/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");

a { color: #169ac6; }
a:hover { color: #58c2e5; }

.sp { display: none; }
.pc { display: inline; }

/*	EXAMPLE STYLES */
body {
  /*font-family: Meiryo, sans-serif;*/
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, 'ＭＳ Ｐゴシック', sans-serif;

  color: #6e6e6e;
  background: #f9f2e1;
  font-size:14px;
}
header {
  text-align: center;
  background: #ffffff;
  -webkit-box-shadow: 0px 5px 10px 0px rgba(201,197,143,0.32);
  -moz-box-shadow: 0px 5px 10px 0px rgba(201,197,143,0.32);
  box-shadow: 0px 5px 10px 0px rgba(201,197,143,0.32);
  font-size:12px;
}
main {
  max-width: 970px;
  margin: 0 auto; 
}
article {
  text-align: center;
}
footer {
  text-align: center;
  background: #ffffff;
  padding: 10px 0;
}

/* ----------------- P ----------------- */
.alert { color: #ff0000; margin: 5px 0; font-weight: bold; }
.eg { color: #7c7c7c; margin: 10px 0 0; font-weight: bold; }
.example { color: #8a7555; margin: 0 0 10px; font-weight: bold; }
.center { text-align: center; }
.right { text-align:right; }
.read { padding: 15px 0; line-height: 22px; }


/* ----------------- btn ----------------- */
/*--オレンジ　ボタン--*/
.btn_orange {
  text-align: center;
  background: #ffa13c;
  background-image: -webkit-linear-gradient(top, #ffa13c, #ff7b00);
  background-image: -moz-linear-gradient(top, #ffa13c, #ff7b00);
  background-image: -ms-linear-gradient(top, #ffa13c, #ff7b00);
  background-image: -o-linear-gradient(top, #ffa13c, #ff7b00);
  background-image: linear-gradient(to bottom, #ffa13c, #ff7b00);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  color: #ffffff;
  font-size: 18px;
}
.btn_orange a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  text-align: center;
  padding: 10px 10px 10px 10px;
}
.btn_orange:hover {
  background: #ffc78c;
  background-image: -webkit-linear-gradient(top, #ffc78c, #ff9e4a);
  background-image: -moz-linear-gradient(top, #ffc78c, #ff9e4a);
  background-image: -ms-linear-gradient(top, #ffc78c, #ff9e4a);
  background-image: -o-linear-gradient(top, #ffc78c, #ff9e4a);
  background-image: linear-gradient(to bottom, #ffc78c, #ff9e4a);
  text-decoration: none;
}
.btn_orange.size01 {
  margin: 20px auto;
  width: 200px;
}

/*--グレイ　ボタン--*/
.btn_gray {
  text-align: center;
  background: #a5a5a5;
  background-image: -webkit-linear-gradient(top, #c6c6c6, #9d9d9d);
  background-image: -moz-linear-gradient(top, #c6c6c6, #9d9d9d);
  background-image: -ms-linear-gradient(top, #c6c6c6, #9d9d9d);
  background-image: -o-linear-gradient(top, #c6c6c6, #9d9d9d);
  background-image: linear-gradient(to bottom, #c6c6c6, #9d9d9d);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  color: #ffffff;
  font-size: 18px;
}
.btn_gray a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  text-align: center;
  padding: 10px 10px 10px 10px;
}
.btn_gray:hover {
  background: #bdbdbd;
  background-image: -webkit-linear-gradient(top, #d8d8d8, #b4b4b4);
  background-image: -moz-linear-gradient(top, #d8d8d8, #b4b4b4);
  background-image: -ms-linear-gradient(top, #d8d8d8, #b4b4b4);
  background-image: -o-linear-gradient(top, #d8d8d8, #b4b4b4);
  background-image: linear-gradient(to bottom, #d8d8d8, #b4b4b4);
  text-decoration: none;
}
.btn_gray.size01 {
  margin: 20px auto;
  width: 200px;
}

/*--twitter　ボタン--*/
.twitter_btn {
  margin: 30px auto;
  width: 72%;
  background-image: -webkit-linear-gradient(top, #6dbcf4, #55acee);
  background-image: -moz-linear-gradient(top, #6dbcf4, #55acee);
  background-image: -ms-linear-gradient(top, #6dbcf4, #55acee);
  background-image: -o-linear-gradient(top, #6dbcf4, #55acee);
  background-image: linear-gradient(to bottom, #6dbcf4, #55acee);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
}
.twitter_btn a {
  display:block;
  width: 100%;
  background :url(../images/twitter_icon1.png) 15px center no-repeat;
  color: #ffffff;
  font-size: 18px;
  text-decoration: none;
  padding: 15px 15px 15px 65px;
}
.twitter_btn:hover {
  background-image: -webkit-linear-gradient(top, #9fd1f2, #80c0ed);
  background-image: -moz-linear-gradient(top, #9fd1f2, #80c0ed);
  background-image: -ms-linear-gradient(top, #9fd1f2, #80c0ed);
  background-image: -o-linear-gradient(top, #9fd1f2, #80c0ed);
  background-image: linear-gradient(to bottom, #9fd1f2, #80c0ed);
  text-decoration: none;
}

/*--FB　ボタン--*/
.fb_btn {
  margin: 30px auto;
  width: 72%;
  background: #4f6bad;
  background-image: -webkit-linear-gradient(top, #4f6bad, #3c599b);
  background-image: -moz-linear-gradient(top, #4f6bad, #3c599b);
  background-image: -ms-linear-gradient(top, #4f6bad, #3c599b);
  background-image: -o-linear-gradient(top, #4f6bad, #3c599b);
  background-image: linear-gradient(to bottom, #4f6bad, #3c599b);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
}
.fb_btn a {
  display:block;
  width: 100%;
  background :url(../images/fb_icon1.png) 15px center no-repeat;
  color: #ffffff;
  font-size: 18px;
  text-decoration: none;
  padding: 15px 10px 15px 65px;
}
.fb_btn:hover {
  background: #919db8;
  background-image: -webkit-linear-gradient(top, #919db8, #718bbd);
  background-image: -moz-linear-gradient(top, #919db8, #718bbd);
  background-image: -ms-linear-gradient(top, #919db8, #718bbd);
  background-image: -o-linear-gradient(top, #919db8, #718bbd);
  background-image: linear-gradient(to bottom, #919db8, #718bbd);
  text-decoration: none;
}

/*--twitter　icon3--*/
.twitter_icon3 {
  margin: 10px 0;
  background:url(../images/twitter_icon3.gif) center center no-repeat;
  background-size:contain;
  height: 26px;
  width: 90px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

/*--fb　icon3--*/
.fb_icon3 {
  margin: 10px 0;
  background:url(../images/fb_icon3.gif) center center no-repeat;
  background-size:contain;
  height: 26px;
  width: 90px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}


/* ----------------- form ----------------- */
input[type="text"], #login_form_email, #edit_mail_email {
  color: #8a7555;
  font-size: 12px;
  padding: 0 15px;
  width: 100%;
  height:35px;
  /* border */
  border:1px solid rgb(0, 0, 0);
  /* border-radius */
  border-radius:8px;
  -webkit-border-radius:8px;
  -moz-border-radius:8px;
  /* box-shadow */
  -webkit-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  -moz-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
}

input[type="text"], #ask_email {
  color: #8a7555;
  font-size: 12px;
  padding: 0 15px;
  width: 100%;
  height:35px;
  border:1px solid rgb(0, 0, 0);
  border-radius:8px;
  -webkit-border-radius:8px;
  -moz-border-radius:8px;
  -webkit-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  -moz-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
}
#ask_body {
  color: #8a7555;
  font-size: 12px;
  padding: 10px 15px;
  width: 100%;
  height:150px;
  border:1px solid rgb(0, 0, 0);
  border-radius:8px;
  -webkit-border-radius:8px;
  -moz-border-radius:8px;
  -webkit-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  -moz-box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
  box-shadow: inset 4px 4px 5px 0px rgba(50, 50, 50, 0.2);
}


input[type="checkbox"] {
  width: 15px;
  height: 15px;
  margin-right: 5px;
  border: 1px solid #a3a3a3;
}

ul.form {}
ul.form li {
  margin-bottom: 15px;
}


/* ----------------- header ----------------- */
#head_box {
  max-width: 970px;
  margin: 0 auto;
}
#head_box .h1_top {
  padding-top: 0.3%;
}
#head_box #headerLogo {
  float:left;
  margin: 2.5% 0 1.5% 0;
}
#head_box #headerLogo {
  display:block;
//  background:url(../images/head_logo.gif) center center no-repeat;
  background-size:contain;
  height: 44px;
  width: 187px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#head_box #headerLogo_sms {
  float:right;
  margin: 2% 1% 1.5% 0;
}
#head_box #headerLogo_sms {
  display:block;
  background:url(../images/head_logo_sms.gif) center center no-repeat;
  background-size:contain;
  height: 44px;
  width: 165px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}


/* ----------------- main ----------------- */
.main_box {
  margin: 20px auto 70px; 
}
h1.brown {
  background: #bcb18b;
  color: #ffffff;
  font-size: 18px;
  padding: 7px 15px;
  border-top: 3px double hsl(0, 0%, 100%);
  border-bottom: 3px double hsl(0, 0%, 100%);
}
h2.orange {
  font-size: 18px;
  color: #ff8a00;
  text-align: center;
  padding: 20px 0;
}
h2.orange2 {
  background: #ffffff;
  color: #8a7555;
  font-size: 18px;
  line-height:24px;
  padding: 0px 8px;
  border-left: 5px solid #ff830b;
}




/* ----------------- footer ----------------- */
#foot_box {
  max-width: 970px;
  margin: 0 auto;
}
#foot_box.t {
  padding: 20px 0 0;
}
#foot_box.u {
  padding: 13px 0 25px;
}
#foot_box .foot_logo {
  float: left;
  background :url(../images/foot_logo_sms.gif) center center no-repeat;
  width: 91px;
  height: 33px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
#foot_box .foot_copy {
  float: left;
  font-size: 10px;
  color: #6e6e6e;
}
#foot_box .foot_link {
  float: right;
  font-size: 12px;
}
#foot_box .foot_link li {
  display:inline-block;
  border-right: 1px solid #666;
  line-height:12px;
  padding: 0 10px;
}
#foot_box .foot_link a {
  color: #6e6e6e;
  text-decoration: none;
}
#foot_box .foot_link li:last-child {
  border-right: 0px;
  padding: 0 0 0 10px;
}
#foot_box .foot_link a:hover {
  text-decoration: underline;
}

/*--FOOT　ボタン--*/
#foot_box .foot_btn{
  float: right;
}
#foot_box .gray_btn{
  margin-left: 5px;
  display: inline-block;
  background:url(../images/arrow_pink.png),-webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#e2e2e2));
  background:url(../images/arrow_pink.png),-moz-linear-gradient(top, #fefefe, #e2e2e2);
  background:url(../images/arrow_pink.png),-ms-linear-gradient(top, #fefefe, #e2e2e2);
  background:url(../images/arrow_pink.png),-o-linear-gradient(top, #fefefe, #e2e2e2);
  background:url(../images/arrow_pink.png),linear-gradient(top, #fefefe, #e2e2e2);
  background-repeat:no-repeat;
  background-position: 117px center,0 0;
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  border: solid #cacaca 1px;
  width: 130px;
  height: 32px;
}
#foot_box .gray_btn a {
  display:block;
  color: #6e6e6e;
  font-size: 14px;
  text-decoration: none;
  text-align:center;
  padding: 6px 10px 6px 0;
}
#foot_box .gray_btn:hover {
  filter:alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;
}
