@charset "utf-8";

/*************************************************
Common CSS
/common/css/common2.css

14.08.14
*************************************************/

/*------------------------------------------- utility
*/
.dib { display: inline-block !important;}
.taj { text-align: justify !important; text-justify: inter-ideograph !important;}

@media screen and (min-width: 768px) {
  .show_sp { display: none !important;}
}
@media screen and (max-width: 767px) {
  .show_pc { display: none !important;}
}


/*-------------------------------------------
*/

body { min-width: 1040px; background: #fff;}

body, html { height: 100%;}
#base_screen {
  position: relative;
  width: 1020px;
  height: 100%; height: auto !important; min-height: 100%;
  background: url(../img/pc_bg.png) repeat-y 50% 0;
  padding: 0 10px;
  margin: 0 auto;
}
.base_screen_inner { padding-bottom: 76px;}

#wrapper { width: 980px; margin: 0 auto;}
.secure #wrapper { background: url(../img/pc_menu_bg.png) repeat-y; margin-top: 10px;}

#header { position: relative; height: 70px; background: #fff; border-bottom: 2px solid #ff9d5b; overflow: hidden;}
.header_inner { width: 980px; padding: 5px 0 0; margin: 0 auto;}
.secure #header { border-bottom: none;}

#container { position: relative; width: 800px; float: right; padding: 0 0 40px 20px;}
#menu {
  position: relative; width: 160px;
  background: url(../img/pc_menu_hl.png) no-repeat;
  float: left;
  padding: 32px 0 60px;
}
.portal #menu { background-color: #fff9f4; padding-bottom: 40px;}

#footer { position: absolute; left: 10px; bottom: 0; width: 1020px; background: #fff; border-top: 2px solid #7dcdf4; padding: 0 0 5px;}
#base_screen #footer2 { margin-top: -76px;}
.footer_inner { width: 980px; padding: 10px 0 20px; margin: 0 auto; overflow: hidden;}

.pie { position: relative; zoom: 1;}

@media screen and (max-width: 767px) {
body { min-width: inherit; background: #fff3d9;}

#base_screen { width: auto; background: none; padding: 0; margin: 0;}
.base_screen_inner { padding-bottom: 80px;}

#wrapper { width: inherit;}
.secure #wrapper { background: none; margin-top: 0;}

#header { height: 50px;}
.header_inner { width: auto; padding: 5px 5px 0 10px; margin: inherit;}
.secure #header { border-bottom: 2px solid #ff9d5b;}

#container { width: auto; float: none; padding: 0;}
#menu {
  position: absolute; top: 0; right: 0;
  display: none; width: 90%;
  background: #fff;
  border-left: 2px solid #ff9b57;
  border-bottom: 2px solid #ff9b57;
  padding: 0;
  z-index: 101;
}
.portal #menu { background: #fff; padding: 0;}

#footer { left: 0; width: 100%; background: #fff; border-top: 2px solid #7dcdf4; padding: 0 0 5px;}
#base_screen #footer2 { margin-top: -80px;}
.footer_inner { width: auto; padding: 10px; margin: 0;}
}

/* ============================== header */

.logo { float: left; padding-top: 7px;}
.logo a {
  display: block; width: 192px; height: 48px;
  background: url(../img/logo_pc.png) no-repeat 0 50%;
  text-indent: -9999px; text-decoration: none;
}

.header_sp { display: none;}
.header_pc { float: right;}
.header_pc .h_banner { position: absolute; top: 5px; left: 50%; margin-left: -180px;}
.secure .header_pc .h_banner { width: 360px; text-align: center;}
.secure .header_pc .h_banner img { height: 60px;}
.header_pc .h_nav { text-align: right; font-size: 72%;}
.header_pc .h_nav li { clear: both;}
.header_pc .h_nav .btn_icon { float: left; clear: none; padding: 0 0 4px 10px;}
.header_pc .btn_icon a,
.header_sp .btn_icon a {
  display: block; width: 70px; height: 37px;
  background: #ffba8c;
  background: linear-gradient(top, #ffd5b9, #ffba8c);
  background: -ms-linear-gradient(top, #ffd5b9, #ffba8c);
  background: -moz-linear-gradient(top, #ffd5b9, #ffba8c);
  background: -webkit-linear-gradient(top, #ffd5b9, #ffba8c);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffd5b9), to(#ffba8c));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffd5b9,EndColorStr=#ffba8c);
  border-bottom: 2px solid #ff9751;
  color: #594c39; text-align: center; text-decoration: none;
  border-radius: 5px; -webkit-border-radius: 5px;
  padding: 5px 0 0;
}
.header_pc .btn_icon a img,
.header_sp .btn_icon a img { display: block; margin: 0 auto 1px;}
.header_pc .btn_icon a:hover, .header_pc .btn_icon a:active,
.header_sp.btn_icon a:hover, .header_sp .btn_icon a:active {
  background: #ffd5b9;
  background: linear-gradient(top, #ffba8c, #ffd5b9);
  background: -ms-linear-gradient(top, #ffba8c, #ffd5b9);
  background: -moz-linear-gradient(top, #ffba8c, #ffd5b9);
  background: -webkit-linear-gradient(top, #ffba8c, #ffd5b9);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffba8c), to(#ffd5b9));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffba8c,EndColorStr=#ffd5b9);
}
.header_pc .btn_icon a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.header_sp .btn_icon a { width: 50px; height: 34px;}

.header_sp li { position: relative; float: left; padding-left: 5px;}

.header_sp li.bnr_area { position:relative;}
.header_sp li.bnr_area a { text-decoration: none; letter-spacing: -0.05em;}
.header_sp li .num_mokuhyo1 { position:absolute; top:1px; left:44px; font-size:10px; color:#0C4CB8; width:40px; height:10px; text-align:center;}
.header_sp li .num_mokuhyo2 { position:absolute; bottom:10px; left:36px; font-size:10px; width:40px; height:10px; text-align:center;}
.header_sp li .num_mokuhyo3 { position:absolute; bottom:10px; left:17px; font-size:10px; width:55px; height:10px; text-align:right;}
.header_sp li .num_yatte1 { position:absolute; top:3px; left:65px; font-size:10px; color:#0C4CB8; width:20px; height:10px; text-align:center;}
.header_sp li .num_yatte2 { position:absolute; bottom:10px; left:58px; font-size:10px; color:#FF6600; width:20px; height:10px; text-align:center;}

.header_sp .h_news a { display: block; width: 40px; height: 40px; text-align:center; padding-top: 2px;}
.header_sp .h_news.unread a { text-align: left;}
/*
.header_sp .h_news.unread a:after {
  position: absolute; top: 11px; right: 0;
  display: block; content: ""; width: 40px; height: 14px;
  background: url(../img/icon/icon_new_sp.png) no-repeat 50% 0;
  background-size: auto 14px; -webkit-background-size: auto 14px;
}
*/
.header_sp .h_news.unread a:after {
  position: absolute; top: -3px; right: -2px;
  display: block; content: ""; width: 22px; height: 22px;
  background: url(../img/icon/icon_new2_sp.png) no-repeat;
  background-size: auto 22px; -webkit-background-size: auto 22px;
}
.header_sp .h_menu a {
  display: block; width: 40px; height: 34px;
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
  border-bottom: 2px solid #e95e01;
  text-align: center;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding-top: 6px;
}
.header_message {
  width: 500px;
  margin-left: -250px;
  position: absolute;
  left: 50%; top: 10px;
  text-align: center;
}

/* ------------------ portal header */

.portal .header_pc .btn_icon a { width: 84px; height: 56px; font-size: 119%; padding-top: 3px;}
.portal .header_pc .regist a {
  color: #fff;
  background: #ff4646;
  background: linear-gradient(top, #ff6a6a, #ff4646);
  background: -ms-linear-gradient(top, #ff6a6a, #ff4646);
  background: -moz-linear-gradient(top, #ff6a6a, #ff4646);
  background: -webkit-linear-gradient(top, #ff6a6a, #ff4646);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff6a6a), to(#ff4646));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff6a6a,EndColorStr=#ff4646);
  border-bottom: 2px solid #df0000;
}
.portal .header_pc .regist a:hover {
  background: #ff6a6a;
  background: linear-gradient(top, #ff4646, #ff6a6a);
  background: -ms-linear-gradient(top, #ff4646, #ff6a6a);
  background: -moz-linear-gradient(top, #ff4646, #ff6a6a);
  background: -webkit-linear-gradient(top, #ff4646, #ff6a6a);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff4646), to(#ff6a6a));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff4646,EndColorStr=#ff6a6a);
}

.portal .error_balloon {
  position: absolute; top: 49px; left: 50%;
  width: 194px;
  z-index: 200;
  margin-left: -62px;
}
.portal .error_balloon .error_area0:after {
  position: absolute; top: -7px; left: 32px;
  display: block; width: 12px; height: 7px;
  content: "";
  background: url(../img/pc_error_balloon_arw.png) no-repeat;
  z-index: 201;
}
.portal .error_balloon .error_area0 {
  position: relative;
  background: #fff;
  border: 1px solid #f30;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  padding: 5px 10px;
}

.portal .h_login { font-size: 72%; float: left; padding-right: 3px;}
.portal .h_login li { float: left; padding-left: 6px;}
.portal .h_login li label { display: block;}
.portal .h_login li input[type="password"],
.portal .h_login li input[type="text"] { height: 18px; font-size: 120%; border-radius: 0; -webkit-border-radius: 0;}
.portal .h_login li input[size="20"] { width: 150px;}
.portal .h_login li input[size="10"] { width: 90px;}
.portal .h_login li button {
  height: 24px;
  background: #ffdba1;
  background: linear-gradient(top, #feead0, #ffdba1);
  background: -ms-linear-gradient(top, #feead0, #ffdba1);
  background: -moz-linear-gradient(top, #feead0, #ffdba1);
  background: -webkit-linear-gradient(top, #feead0, #ffdba1);
  background: -webkit-gradient(linear, left top, left bottom, from(#feead0), to(#ffdba1));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#feead0,EndColorStr=#ffdba1);
  font-size: 110%;
  border: 1px solid #ecad50;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 2px 3px 0;
  margin-top: 14px;
}
.portal .h_login li button img { vertical-align: middle; margin: -3px 3px 0 0;}
.portal .h_login li button:hover {
  background: #feead0;
  background: linear-gradient(top, #ffdba1, #feead0);
  background: -ms-linear-gradient(top, #ffdba1, #feead0);
  background: -moz-linear-gradient(top, #ffdba1, #feead0);
  background: -webkit-linear-gradient(top, #ffdba1, #feead0);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffdba1), to(#feead0));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffdba1,EndColorStr=#feead0);
}
.portal .h_reminder { padding: 5px 5px 0; overflow: hidden;}
.portal .h_reminder input { vertical-align: middle;}
.portal .h_reminder p { float: right; padding: 0;}
.portal .h_nav { float: left;}

.portal .header_pc .h_banner { position: static; float: left; padding: 10px 8px 0 0; margin: 0;}

/* ------------------ global_navi */

.global_navi { position: relative; background: #fff; padding-bottom: 5px; z-index: 50;}

.global_navi ul { position: relative; width: 980px; margin: 0 auto;}
.global_navi ul li { float: left; padding-left: 6px;}
.global_navi ul li:first-child { padding-left: 1px;}
.global_navi ul li span,
.global_navi ul li a {
  display: block;
  width: 189px;
  height: 37px;
  background: #ff8d42;
  background: linear-gradient(top, #ffb888, #ff8d42);
  background: -ms-linear-gradient(top, #ffb888, #ff8d42);
  background: -moz-linear-gradient(top, #ffb888, #ff8d42);
  background: -webkit-linear-gradient(top, #ffb888, #ff8d42);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffb888), to(#ff8d42));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffb888,EndColorStr=#ff8d42);
  text-align: center;
  border: 1px solid #ff9751;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 5px 0 0;
  cursor: pointer;
}
.global_navi ul li span:hover,
.global_navi ul li a:hover {
  background: #ffb888;
  background: linear-gradient(top, #ff8d42, #ffb888);
  background: -ms-linear-gradient(top, #ff8d42, #ffb888);
  background: -moz-linear-gradient(top, #ff8d42, #ffb888);
  background: -webkit-linear-gradient(top, #ff8d42, #ffb888);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff8d42), to(#ffb888));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff8d42,EndColorStr=#ffb888);
}
.global_navi ul li a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.global_navi ul ul {
  position: absolute; top: 44px;
  display: none; width: 179px;
  background: #fff;
  padding: 5px;
  z-index: 10;
}
.global_navi ul ul li { float: none; border-top: 1px solid #d6cbbe; padding: 0;}
.global_navi ul ul li:first-child { border-top: none;}
.global_navi ul ul li a {
  width: auto;
  height: auto;
  background: url(../../common/img/pc_arw3.png) no-repeat 5px 50%;
  filter: none;
  color: #66543f;
  text-align: left;
  text-decoration: none;
  line-height: 1.2;
  border: none;
  padding: 10px 0 10px 16px;
}
.global_navi ul ul li a:hover {
  background: url(../../common/img/pc_arw3.png) no-repeat 5px 50%; color: #f60;
  filter: none;
}

.global_navi.txt { background: #fff; padding: 0 15px; overflow: hidden;}
.global_navi.txt li { box-sizing: border-box; -webkit-box-sizing: border-box; width: 25%; float: left; padding: 0 5px;}
.global_navi.txt li a {
  display: block;
  height: 37px;
  background: #ccc;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  line-height: 36px;
  border-radius: 4px; -webkit-border-radius: 4px;
}
.global_navi.txt .gn0 a {
  background: #f80;
  background: linear-gradient(top, #f80, #f60);
  background: -ms-linear-gradient(top, #f80, #f60);
  background: -moz-linear-gradient(top, #f80, #f60);
  background: -webkit-linear-gradient(top, #f80, #f60);
  background: -webkit-gradient(linear, left top, left bottom, from(#f80), to(#f60));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff8800,EndColorStr=#ff6600);
  border: 1px solid #f60;
}
.global_navi.txt .gn0 a:hover {
  background: #f60;
  background: linear-gradient(top, #f60, #f80);
  background: -ms-linear-gradient(top, #f60, #f80);
  background: -moz-linear-gradient(top, #f60, #f80);
  background: -webkit-linear-gradient(top, #f60, #f80);
  background: -webkit-gradient(linear, left top, left bottom, from(#f60), to(#f80));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff6600,EndColorStr=#ff8800);
}
.global_navi.txt .gn1 a {
  background: #ffdb33;
  background: linear-gradient(top, #ffdb33, #ffc004);
  background: -ms-linear-gradient(top, #ffdb33, #ffc004);
  background: -moz-linear-gradient(top, #ffdb33, #ffc004);
  background: -webkit-linear-gradient(top, #ffdb33, #ffc004);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffdb33), to(#ffc004));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffdb33,EndColorStr=#ffc004);
  border: 1px solid #ffc004;
}
.global_navi.txt .gn1 a:hover {
  background: #ffc004;
  background: linear-gradient(top, #ffc004, #ffdb33);
  background: -ms-linear-gradient(top, #ffc004, #ffdb33);
  background: -moz-linear-gradient(top, #ffc004, #ffdb33);
  background: -webkit-linear-gradient(top, #ffc004, #ffdb33);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffc004), to(#ffdb33));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffc004,EndColorStr=#ffdb33);
}
.global_navi.txt .gn2 a {
  background: #4ddfd8;
  background: linear-gradient(top, #4ddfd8, #24c8bf);
  background: -ms-linear-gradient(top, #4ddfd8, #24c8bf);
  background: -moz-linear-gradient(top, #4ddfd8, #24c8bf);
  background: -webkit-linear-gradient(top, #4ddfd8, #24c8bf);
  background: -webkit-gradient(linear, left top, left bottom, from(#4ddfd8), to(#24c8bf));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#4ddfd8,EndColorStr=#24c8bf);
  border: 1px solid #24c8bf;
}
.global_navi.txt .gn2 a:hover {
  background: #24c8bf;
  background: linear-gradient(top, #24c8bf, #4ddfd8);
  background: -ms-linear-gradient(top, #24c8bf, #4ddfd8);
  background: -moz-linear-gradient(top, #24c8bf, #4ddfd8);
  background: -webkit-linear-gradient(top, #24c8bf, #4ddfd8);
  background: -webkit-gradient(linear, left top, left bottom, from(#24c8bf), to(#4ddfd8));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#24c8bf,EndColorStr=#4ddfd8);
}
.global_navi.txt .gn3 a {
  background: #fd889d;
  background: linear-gradient(top, #fd889d, #fb6a79);
  background: -ms-linear-gradient(top, #fd889d, #fb6a79);
  background: -moz-linear-gradient(top, #fd889d, #fb6a79);
  background: -webkit-linear-gradient(top, #fd889d, #fb6a79);
  background: -webkit-gradient(linear, left top, left bottom, from(#fd889d), to(#fb6a79));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#fd889d,EndColorStr=#fb6a79);
  border: 1px solid #fb6a79;
}
.global_navi.txt .gn3 a:hover {
  background: #fb6a79;
  background: linear-gradient(top, #fb6a79, #fd889d);
  background: -ms-linear-gradient(top, #fb6a79, #fd889d);
  background: -moz-linear-gradient(top, #fb6a79, #fd889d);
  background: -webkit-linear-gradient(top, #fb6a79, #fd889d);
  background: -webkit-gradient(linear, left top, left bottom, from(#fb6a79), to(#fd889d));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#fb6a79,EndColorStr=#fd889d);
}

@media screen and (max-width: 767px) {
.header_pc { display: none;}
.header_sp { display: block; float: right;}

.logo { padding-top: 3px;}
.logo a {
  width: 105px; height: 34px;
  background-image: url(../img/logo_sp.png);
  background-size: 105px auto; -webkit-background-size: 105px auto;
}

.global_navi { display: none;}

.secure #header { border-bottom: none;}
.global_navi.txt { display: block; padding: 5px 3px 0; margin-bottom: 10px;}
.global_navi.txt li { padding: 0 2px;}
.global_navi.txt li a { height: 26px; font-size: 12px; line-height: 26px;}
}

.cmpbnr_gnav {
  margin: 10px;
}
.cmpbnr_gnav a {
  display: block;
}
.cmpbnr_gnav img {
  max-width: 100%;
}
@media not screen and (max-width: 767px) { /* pc */
  .cmpbnr_gnav { display: none; }
}

/* ============================== header2 portal */

#header2 { background-color: #fff;}
#header2 .header_inner {
  width: 1020px;
  overflow: hidden;
  padding: 0 0 15px;
}

#header2 .logo { padding: 10px 0 0 20px;}
.portal .header_navi2,
.portal .global_navi2 { float: right;}
.portal .header_navi2 { padding-top: 20px; padding-right: 20px;}
.portal .header_navi2 li { display: inline-block; float: left; padding-left: 10px;}
.portal .header_navi2 .hide_pc { display: none;}
.portal .header_navi2 li a {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  display: inline-block;
  width: 160px;
  height: 30px;
  font-size: 16px;
  line-height: 27px;
  text-align: center;
  border-bottom-width: 2px;
  padding: 0;
}
.portal .header_navi2 br { display: none;}
.portal .global_navi2 { padding-top: 15px;}
.portal .global_navi2 li {
  display: inline-block;
  float: left;
  border-right: 2px dotted #665540;
  padding: 0 14px;
}
.portal .global_navi2 li:first-child { border-left: 2px dotted #665540;}
.portal .global_navi2 a {
  color: #665540;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 15px;
  text-decoration: none;
}

@media screen and (max-width: 767px) {
#header2 .header_inner { width: auto; height: 40px; padding: 5px;}
#header2 .logo { padding: 2px 0 0 5px;}
.portal .global_navi2 { display: none;}
.portal .header_navi2 { padding-top: 0; padding-right: 0;}
.portal .header_navi2 ul { display: inline-block; vertical-align: top;}
.portal .header_navi2 li { padding-left: 5px;}
.portal .header_navi2 .hide_sp { display: none;}
.portal .header_navi2 .hide_pc,
#base_screen .header_navi2 .h_menu2 { display: inline-table; height: 40px; vertical-align: top;}
.portal .header_navi2 li { display: inline-table; height: 40px;}
.portal .header_navi2 .h_menu2 a,
.portal .header_navi2 li a {
  display: table-cell;
  width: 40px;
  background-image: url(../img/arw5.png);
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: 9px auto; -webkit-background-size: 9px auto;
  font-size: 10px;
  text-align: center;
  line-height: 1.1;
  letter-spacing: -0.1em;
  vertical-align: middle;
  border-bottom-width: 2px;
  padding: 0 0 8px;
}
.portal .header_navi2 .h_menu2 a {
  background-image: url(../img/icon/icon_menu2.png);
  background-position: 50% 50%;
  background-size: 26px auto; -webkit-background-size: 26px auto;
  text-indent: -9999px;
  padding-bottom: 0;
}
.portal .header_navi2 br { display: inline;}
}

/* ============================== container */

a:hover img { opacity: 0.8; filter: alpha(opacity=80); filter: -ms-alpha(opacity=80);}

.breadcrumb_list { font-size: 86%; padding: 10px 0 12px;}
.breadcrumb_list a { color: #333;}
.breadcrumb_list a:hover { text-decoration: none;}
.breadcrumb_list a:active { color: #f60;}

.contents { width: 600px; float: left;}
#wrapper.contents_one { width: 600px; background: none; margin: 0 auto;}
.contents_one #container { width: auto; padding: 0; float: none;}
.contents_one #menu { display: none;}
.contents_inner { background: #fff; border-bottom: 2px solid #ffe9bb; padding: 20px; margin: 0 0 40px;}

@media screen and (max-width: 767px) {
.contents { width: auto; float: none; padding: 0 10px 10px;}
#wrapper.contents_one { width: auto;}
.contents_inner { background: none; border: none; padding: 0 10px; margin: 0 0 20px;}

.breadcrumb_list { background: #ffe8b9; font-size: 72%; padding: 5px !important;}
}

@media screen and (max-width: 767px) {
  .search-back-area { padding-left: 5px !important;}
}

/* ------------------ contents head line */

.hl0, .hl0_icon, h1 { position: relative; background: #ffc49d; color: #675641; padding: 12px 15px; margin: 0 0 10px;}
h1 { text-align: left; padding: 6px 10px 6px 70px; margin: 0 0 20px -20px;}
.hl0, .hl0_icon { font-weight: normal; text-align: left; line-height: 100%; margin: 20px 0 15px;}
.hl0:before, .hl0:after, .hl0_icon:before, .hl0_icon:after, h1:before, h1:after { position: absolute; left: 0; display: block; content: ""; width: 100%; height: 3px;}
.hl0:before, .hl0_icon:before { top: 0; background: url(../../common/img/hl_top.png) repeat-x;}
.hl0:after, .hl0_icon:after, h1:after { bottom: 0; background: url(../../common/img/hl_bottom.png) repeat-x 0 100%;}
.hl0 img, .hl0_icon img, h1 img { vertical-align: middle; margin-right: 5px;}
.hl0_icon { padding: 8px 10px 6px;}
.hl0_icon img {
  max-width: 30px; width: expression(this.width >= this.height ? "30px" : "auto");
  max-height: 30px; height: expression(this.width <= this.height ? "30px" : "auto");
  margin-top: -4px;
}

h1 img,
h2 img { vertical-align: middle;}
h1 img.img_icon { height: 20px; margin: -2px 5px 0;}

.hl1 {
  color: #92521d;
  font-size: 115%;
  background: url(../img/pc_hl0.png) repeat-x 0 100%;
  padding: 5px 5px 10px;
  margin: 0 0 10px;
}

.hl2 {
  color: #92521d;
  font-size: 158%;
  text-align: center;
  padding: 10px 0 20px;
}

.hl3 {
  color: #5a4028;
  font-size: 150%;
  text-align: center;
  padding: 10px 0 10px;
  background: #ffc49d;
}

.btn_back { position: absolute; top: 4px; left: 20px;}
.btn_back a {
  display: block; width: 34px; height: 20px;
  background: url(../img/pc_btn_back.png) no-repeat;
  color: #fff; font-size: 85%; text-align: center; text-decoration: none;
  padding: 2px 0 0 6px;
}
.btn_back a:hover, .btn_back a:active { background-position: 100% 0;}
.labelTop { position: relative;}
.labelTop .btn_back { top: 50%; margin-top: -11px;}

.btn_select { position: absolute; top: 4px; right: 5px;}

.fs10 { font-size: 10px;}
.fs12 { font-size: 12px;}
.fs16 { font-size: 16px;}

@media screen and (max-width: 767px) {
.hl0, .hl0_icon, h1 { font-size: 115%; padding: 9px 10px; margin: 0 0 10px;}
h1 { font-weight: bold; text-align: center; padding: 8px 70px 10px; margin:0;}
h1 img.img_icon { height: 24px; margin-top: -4px;}
.hl0, .hl0_icon { margin: 15px -10px 10px;}
.hl0:before, .hl0_icon:before { top: 0; background: url(../../common/img/hl_top.png) repeat-x; background-size: 50px 3px; -webkit-background-size: 50px 3px;}
.hl0:after, .hl0_icon:after, h1:after { bottom: 0; background: url(../../common/img/hl_bottom.png) repeat-x 0 100%; background-size: 50px 3px; -webkit-background-size: 50px 3px;}
.hl0_icon { padding: 6px 10px 3px;}
.hl0_icon img {
  max-width: 30px; width: expression(this.width >= this.height ? "30px" : "auto");
  max-height: 30px; height: expression(this.width <= this.height ? "30px" : "auto");
}
.txtS { font-size: 14px;}
.hl1 { background-image: url(../img/hl0.png); background-size: auto 2px; -webkit-background-size: auto 2px;}

.hl2 { font-size: 115%; padding: 10px 0;}
.hl3 { font-size: 120%; margin: 0 -10px; padding: 10px 0;}

.btn_back { top: 4px; left: 5px;}
.btn_back a {
  width: 54px; height: 28px;
  background-image: url(../img/btn_back.png);
  background-size: 120px 32px; -webkit-background-size: 120px 32px;
  font-size: 100%;
  padding-top: 4px;
  padding-left: 6px;
}
.labelTop .btn_back { margin-top: -16px;}
}

.btn_h1_help {
  display: inline-block;
  margin-left: 5px;
}
.btn_h1_help img {
  height: 1.4em;
}
@media not screen and (max-width:767px) { /* pc */
  .btn_h1_help {
    vertical-align: top;
  }
}

/* ------------------ contents form */

.step_area { padding: 0 0 25px;}
.step_area li { width: 195px; background: url(../img/pc_step_arw0.png) no-repeat 100% 50%; float: left; margin-right: 5px;}
.step_area .end { width: 160px; margin: 0;}
.step_area li span {
  display: block;
  width: 160px;
  background: #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  color: #fff; font-size: 129%; font-weight: bold; text-align: center; line-height: 100%;
  padding: 8px 0;
}
.step_area li em { font-size: 144%;}
.step_area .this { background-image: url(../img/pc_step_arw1.png);}
.step_area .this span { background-color: #ff7373;}

.btn_agreement { font-size: 115%; text-align: center; padding: 0 0 10px;}
.form_agreement_txt { background: #fff; height: 200px; border: 1px solid #e2a36e; padding: 15px; overflow: auto; margin-bottom: 20px;}
.form_agreement_txt h2 { background: #ffc49d; text-align: center; padding: 5px; margin-bottom: 10px;}

.form_agreement_txt ol > li > ol {
  margin: 5px auto;
  padding-left: 0;
}
.form_agreement_txt ol > li > ol > li {
  list-style: none;
}

/* form_area */
.form_area { padding: 10px 0;}
.form_area .form_table { width: 100%; margin-bottom: 15px;}
.form_area .form_table th,
.form_area .form_table td { padding: 10px; vertical-align: middle;}
.form_area .form_table th { width: 120px; text-align: right;}
.form_area .form_table th.al { text-align: left; padding-bottom: 0;}
.form_area .form_table .v_top { vertical-align: top;}
.form_area .form_table th.v_top { padding-top: 12px;}
.form_area input[size="20"] { width: 50%;}
.form_area input[size="30"] { width: 72%;}
.form_area input[size="40"] { width: 90%;}
.form_area input[type="text"],
.form_area input[type="password"],
.form_area input[type="search"],
.form_area input[type="tel"],
.form_area input[type="email"] { padding: 6px; box-shadow: 0 2px 4px #ddd inset; -webkit-box-shadow: 0 2px 4px #ddd inset;}
.form_area .inline_label li { display: inline-block; padding: 0 20px 5px 0;}
.form_area input[type="radio"],
.form_area input[type="checkbox"] { margin-right: 6px;}
.form_area select { padding: 4px;}
.form_area option { padding: 0 10px; vertical-align: middle;}
.form_area textarea { width: 93.5%;}
.form_area strong { color: #ff4646; font-weight: normal; font-size: 86%;}
.form_area .sp_txt { padding-left: 20px; padding-right: 20px;}

label.disable { color: #999;}

.form_area .conf_box,
.form_area .form_box { background: #fff; border: 1px solid #e2a36e; padding: 10px; margin: 10px 0 20px;}
.form_area .conf_box { padding: 10px 16px;}
.form_area .form_box { border-radius: 8px; -webkit-border-radius: 8px;}
.form_area .form_box .form_table { margin-bottom: 0;}

.form_area .form_conf,
.form_area .form_conf th,
.form_area .form_conf td { border: 1px solid #e2a36e; padding: 10px 15px;}
.form_area .form_conf { width: 100%; background: #fff; padding: 0; margin-bottom: 10px;}
.form_area .form_conf th { width: 30%; background: #f3dac5;}
.form_area .comp_txt { padding-bottom: 20px;}

.form_more { text-align: right; padding: 5px 0 20px;}
.form_more a {
  display: inline-block;
  background: #ffddc6 url(../img/pc_arw_down0.png) no-repeat 8px 50%;
  border-bottom: 2px solid #ffb98a;
  color: #f60; font-weight: bold; text-align: center; text-decoration: none;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 6px 10px 6px 30px;
  *display: inline; *zoom: 1;
}
.form_more a:hover, .form_more a:active { background-color: #ffd1b3;}
/* end */

.form_boxA { padding: 10px 0 0;}
.form_boxA dt { padding: 0 5px 5px;}
.form_boxA dd { padding: 0 0 5px;}

.form_line { padding: 0 0 10px; overflow: hidden;}
.form_line table { width: 100%;}
.form_line th,
.form_line td { padding: 0 5px 5px;}
.form_line th { width: 40%; padding-top: 3px; text-align: right;}
.form_line td.ar { text-align: right;}

.form_select { text-align: center; padding: 0 0 20px;}
.form_select select {
  min-width: 360px;
  max-width: 520px; width: expression(this.width >= this.height ? "520px" : "auto");
}

.form_select select.line_style {
  box-shadow: 0 2px 2px #ddd inset; -webkit-box-shadow: 0 2px 2px #ddd inset;
  border: 2px solid #ffb888;
  padding: 4px 10px;
}
.form_select.date_select select { min-width: inherit; max-width:inherit;}

.form_radio {
  background: url(../img/pc_form_radio_off.png) no-repeat 0 50%;
  padding-left: 20px;
}
.form_radio.checked { background-image: url(../img/pc_form_radio_on.png);}
.form_radio input { display: none;}

.form_list_box, .form_list_line { padding: 0 10px 10px; margin: 0;}
.form_list_box li, .form_list_line li { padding: 0 10px 5px 0;}
.form_list_box li { display: block;}
.form_list_line li { display: inline-block; *display: inline; *zoom: 1;}

.form_search { padding: 5px 10px 10px; text-align: center;}
.kiroku_search .form_search { padding: 0; text-align: left;}
.form_search input { vertical-align: middle;}
.form_search input[type="text"] {
  width: 66%;
  background: #fff url(../img/icon/pc_icon_search.png) no-repeat 10px 50%;
  box-shadow: 0 2px 2px #ddd inset; -webkit-box-shadow: 0 2px 2px #ddd inset;
  border: 2px solid #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 7px 0 7px 34px;
  margin-right: 5px;
}

.form_search input[type="text"]:placeholder-shown {color: #C0C0C0; }
.form_search input[type="text"]::-webkit-input-placeholder {color: #C0C0C0; } /* Google Chrome, Safari, Opera 15+, Android, iOS */
.form_search input[type="text"]:-moz-placeholder {color: #C0C0C0; opacity: 1; } /* Firefox 18- */
.form_search input[type="text"]::-moz-placeholder {color: #C0C0C0; opacity: 1; } /* Firefox 19+ */
.form_search input[type="text"]:-ms-input-placeholder {color: #C0C0C0; } /* IE 10+ */

.form_search button,
.form_search input[type="button"] {
  min-width: 50px;
  height: 34px;
  background: #ccc;
  background: linear-gradient(top, #f0f0f0, #ccc);
  background: -ms-linear-gradient(top, #f0f0f0, #ccc);
  background: -moz-linear-gradient(top, #f0f0f0, #ccc);
  background: -webkit-linear-gradient(top, #f0f0f0, #ccc);
  background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#ccc));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f0f0f0,EndColorStr=#cccccc);
  vertical-align: middle;
  border: 1px solid #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  color: #333;
}
.form_search button:hover, .form_search button:active,
.form_search input[type="button"]:hover, .form_search input[type="button"]:active {
  background: #f0f0f0;
  background: linear-gradient(top, #ccc, #f0f0f0);
  background: -ms-linear-gradient(top, #ccc, #f0f0f0);
  background: -moz-linear-gradient(top, #ccc, #f0f0f0);
  background: -webkit-linear-gradient(top, #ccc, #f0f0f0);
  background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#f0f0f0));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#cccccc,EndColorStr=#f0f0f0);
  color: #333;
}

.form_search button.btn_b,
.form_search input[type="button"].btn_b {
  width: auto;
  height: 34px;
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
  text-shadow: 0 1px 0 #e95e01;
  border-bottom-color: #e95e01;
  color: #fff;
  font-size: 100%;
}
.form_search button.btn_b:hover, .form_search button.btn_b:active,
.form_search input[type="button"].btn_b:hover, .form_search input[type="button"].btn_b:active {
  background: #ff9d5b;
  background: linear-gradient(top, #ff802b, #ff9d5b);
  background: -ms-linear-gradient(top, #ff802b, #ff9d5b);
  background: -moz-linear-gradient(top, #ff802b, #ff9d5b);
  background: -webkit-linear-gradient(top, #ff802b, #ff9d5b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff802b), to(#ff9d5b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff802b,EndColorStr=#ff9d5b);
}

.hr { border-top: 1px dotted #999; margin: 0; padding: 20px 0;}
.hr .form_search { padding: 0;}

.icon_ine { text-align: right;}
.icon_ine a { display: inline-block; text-decoration: none; vertical-align: middle;}
.icon_ine a {
  height: 22px;
  background: #fff;
  background: linear-gradient(top, #fff, #f0f0f0);
  background: -ms-linear-gradient(top, #fff, #f0f0f0);
  background: -moz-linear-gradient(top, #fff, #f0f0f0);
  background: -webkit-linear-gradient(top, #fff, #f0f0f0);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f0f0f0));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#f0f0f0);
  font-size: 12px;
  font-weight: bold;
  line-height: 22px;
  border: 1px solid #f60;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 0 6px;
}
.icon_ine a:hover {
  background: #f0f0f0;
  background: linear-gradient(top, #f0f0f0, #fff);
  background: -ms-linear-gradient(top, #f0f0f0, #fff);
  background: -moz-linear-gradient(top, #f0f0f0, #fff);
  background: -webkit-linear-gradient(top, #f0f0f0, #fff);
  background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#fff));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f0f0f0,EndColorStr=#ffffff);
}
.icon_ine a img { vertical-align: middle; margin-top: -4px; padding-right: 4px; opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}
.icon_ine.checked a { color: #fff; background: #f60; filter: none;}
.icon_ine.checked a:hover { background: #f70;}

.icon_ine .count {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  position: relative;
  display: inline-block;
  min-width: 50px;
  height: 24px;
  line-height: 22px;
  vertical-align: middle;
  background-color: #fff;
  border: 1px solid #f60;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 0 6px;
  margin-left: 8px;
}
.icon_ine .count:before {
  position: absolute;
  top: 7px;
  left: -10px;
  content: "";
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-right-color: #f60;
}
.icon_ine .count:after {
  position: absolute;
  top: 9px;
  left: -6px;
  content: "";
  width: 0;
  height: 0;
  border: 3px solid transparent;
  border-right-color: #fff;
}

@media screen and (max-width: 767px) {
.step_area { padding: 0 0 10px;}
.step_area li {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  width: 36%;
  background-image: url(../img/step_arw0.png);
  background-size: auto 20px; -webkit-background-size: auto 20px;
  padding-right: 30px;
  margin-right: 0;
}
.step_area .end { width: 28%; padding-right: 0;}
.step_area li span { width: 100%; font-size: 100%;}
.step_area li em { font-size: 115%;}
.step_area .this { background-image: url(../img/step_arw1.png);}
.step_area .this span { background-color: #ff7373;}

.btn_agreement { font-size: 100%;}
.form_agreement_txt { background: #fff; height: 160px; font-size: 86%; letter-spacing: 0.05em; line-height: 1.6; padding: 10px;}
.form_agreement_txt h2 { font-size: 117%; margin-bottom: 5px;}
.form_agreement_txt .hl1 { font-size: 117%; padding: 10px 5px 5px;}

.form_area { padding: 0;}
.form_area .form_table { padding: 5px;}
.form_area .form_table th,
.form_area .form_table td { padding: 5px;}
.form_area .form_table th { width: 38%;}
.form_area .form_table .v_top_sp { vertical-align: top; padding-top: 12px;}
.form_area input[type="text"],
.form_area input[type="password"],
.form_area input[type="search"],
.form_area input[type="tel"],
.form_area input[type="email"] { padding: 5px;}
.form_area .inline_label li { display: inline-block; padding: 0 10px 5px 0;}
.form_area input[type="radio"],
.form_area input[type="checkbox"] { margin-right: 4px;}
.form_area select { padding: 2px;}
.form_area option { padding: 0 5px;}
.form_area textarea { width: 96%;}
.form_area .sp_txt { padding-left: 0; padding-right: 0;}

.form_area .conf_box,
.form_area .form_box { padding: 5px;}
.form_area .conf_box { padding: 5px 10px;}
.form_area .form_box { border-radius: 4px; -webkit-border-radius: 4px;}
.form_area .form_conf th,
.form_area .form_conf td { padding: 5px 10px;}
.form_area .comp_txt { padding-bottom: 10px;}
.form_area .block_sp { display: block; padding-top: 4px;}

.form_area .form_btn { padding: 5px 0 15px;}

.form_more a {
  background-image: url(../img/arw_down0.png);
  background-size: auto 14px; -webkit-background-size: auto 14px;
  font-size: 86%;
  padding-left: 26px;
}

.form_list_box, .form_list_line { padding: 0 10px 5px; margin: 0 -10px;}
.form_select { padding: 5px 0 15px;}
.form_select select {
  min-width: 220px;
  max-width: 300px; width: expression(this.width >= this.height ? "300px" : "auto");
}

.form_radio {
  background-image: url(../img/form_radio_off.png);
  background-size: auto 14px; -webkit-background-size: auto 14px;
}
.form_radio.checked { background-image: url(../img/form_radio_on.png);}

.form_search input[type="text"] {
  background-image: url(../img/icon/icon_search.png);
  background-size: auto 16px; -webkit-background-size: auto 16px;
}

.hr { padding: 10px 0;}

.icon_ine a {
  height: auto;
  background: inherit;
  filter: none;
  font-size: 14px;
  font-weight: normal;
  line-height: 100%;
  border: none;
  border-radius: none;
  padding: 0;
}
.icon_ine a:hover { color: #f80; background: inherit; filter: none;}
.icon_ine.checked a { background: none; color: #f30; font-weight: bold;}
.icon_ine.checked a:hover { background: none; color: #f80;}
}

/* ------------------ contents button */

.btn_area, .form_btn { text-align: center; padding: 10px 0;}
.btn_area { padding: 20px 0 10px;}

.btn_area.half, .form_btn.half { width: 540px; margin: 0 auto; overflow: hidden;}

.btn_disabled, .btn_a, .btn_b, .btn_c, .btn_f, .btn_g, .btn_i {
  width: 280px; height: 50px;
  color: #fff; font-size: 115%; font-weight: bold; text-align: center; text-decoration: none;
  border: none; border-bottom: 3px solid transparent; border-radius: 6px; -webkit-border-radius: 6px;
  padding: 2px 5px; margin: 0 auto;
}
.btn_disabled, a.btn_a, a.btn_b, a.btn_c, a.btn_f, a.btn_g, a.btn_i {
  display: inline-block; width: 270px; height: 43px;
  color: #fff; line-height: 43px;
  *display: inline; *zoom: 1;
}
.half .btn_disabled, .half .btn_a, .half .btn_b, .half .btn_c, .half .btn_f, .half .btn_g, .half .btn_i { width: 255px; float: left; margin: 0;}
.half .btn_disabled, .half a.btn_a, .half a.btn_b, .half a.btn_c, .half a.btn_f, .half a.btn_g, .half a.btn_i { width: 245px;}
.btn_area.half span:first-child, .form_btn.half span:first-child,
.btn_area.half input:first-child, .form_btn.half input:first-child,
.btn_area.half button:first-child, .form_btn.half button:first-child,
.btn_area.half a:first-child, .form_btn.half a:first-child { margin-right: 30px;}

.btn_a, a.btn_a {
  background: #ff4646;
  background: linear-gradient(top, #ff6a6a, #ff4646);
  background: -ms-linear-gradient(top, #ff6a6a, #ff4646);
  background: -moz-linear-gradient(top, #ff6a6a, #ff4646);
  background: -webkit-linear-gradient(top, #ff4646, #ff4646);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff6a6a), to(#ff4646));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff6a6a,EndColorStr=#ff4646);
  text-shadow: 0 1px 0 #ea0000;
  border-bottom-color: #df0000;
}
.btn_a:hover, .btn_a:active,
a.btn_a:hover, a.btn_a:active {
  background: #ff6a6a;
  background: linear-gradient(top, #ff4646, #ff6a6a);
  background: -ms-linear-gradient(top, #ff4646, #ff6a6a);
  background: -moz-linear-gradient(top, #ff4646, #ff6a6a);
  background: -webkit-linear-gradient(top, #ff4646, #ff6a6a);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff4646), to(#ff6a6a));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff4646,EndColorStr=#ff6a6a);
}
.btn_b, a.btn_b {
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
  text-shadow: 0 1px 0 #e95e01;
  border-bottom-color: #e95e01;
}
.btn_b:hover, .btn_b:active,
a.btn_b:hover, a.btn_b:active {
  background: #ff9d5b;
  background: linear-gradient(top, #ff802b, #ff9d5b);
  background: -ms-linear-gradient(top, #ff802b, #ff9d5b);
  background: -moz-linear-gradient(top, #ff802b, #ff9d5b);
  background: -webkit-linear-gradient(top, #ff802b, #ff9d5b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff802b), to(#ff9d5b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff802b,EndColorStr=#ff9d5b);
}
.btn_c, a.btn_c {
  background: #ccc;
  background: linear-gradient(top, #d8d8d8, #ccc);
  background: -ms-linear-gradient(top, #d8d8d8, #ccc);
  background: -moz-linear-gradient(top, #d8d8d8, #ccc);
  background: -webkit-linear-gradient(top, #d8d8d8, #ccc);
  background: -webkit-gradient(linear, left top, left bottom, from(#d8d8d8), to(#ccc));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#d8d8d8,EndColorStr=#cccccc);
  color: #666; text-shadow: 0 1px 0 #fff;
  border-bottom-color: #999;
}
.btn_c:hover, .btn_c:active,
a.btn_c:hover, a.btn_c:active {
  background: #d8d8d8;
  background: linear-gradient(top, #ccc, #d8d8d8);
  background: -ms-linear-gradient(top, #ccc, #d8d8d8);
  background: -moz-linear-gradient(top, #ccc, #d8d8d8);
  background: -webkit-linear-gradient(top, #ccc, #d8d8d8);
  background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#d8d8d8));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#cccccc,EndColorStr=#d8d8d8);
}
.btn_f, a.btn_f {
  background: #ffc69f;
  background: linear-gradient(top, #ffd9bf, #ffc69f);
  background: -ms-linear-gradient(top, #ffd9bf, #ffc69f);
  background: -moz-linear-gradient(top, #ffd9bf, #ffc69f);
  background: -webkit-linear-gradient(top, #ffd9bf, #ffc69f);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffd9bf), to(#ffc69f));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffd9bf,EndColorStr=#ffc69f);
  color: #f60; text-shadow: 0 1px 0 #fff;
  border-bottom-color: #fe8f45;
}
.btn_f:hover, .btn_f:active,
a.btn_f:hover, a.btn_f:active {
  background: #ffd9bf;
  background: linear-gradient(top, #ffc69f, #ffd9bf);
  background: -ms-linear-gradient(top, #ffc69f, #ffd9bf);
  background: -moz-linear-gradient(top, #ffc69f, #ffd9bf);
  background: -webkit-linear-gradient(top, #ffc69f, #ffd9bf);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffc69f), to(#ffd9bf));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffc69f,EndColorStr=#ffd9bf);
}
.btn_g, a.btn_g {
  background: #f2f2f2;
  background: linear-gradient(top, #fff, #f2f2f2);
  background: -ms-linear-gradient(top, #fff, #f2f2f2);
  background: -moz-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f2f2f2));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#f2f2f2);
  box-shadow: 0 3px 0 #ccc; -webkit-box-shadow: 0 3px 0 #ccc;
  color: #666; text-shadow: 0 1px 0 #fff;
  border: 1px solid #d9d9d9;
}
.btn_g { height: 47px;}
a.btn_g { width: 278px; height: 41px; line-height: 42px;}
.half a.btn_g { width: 243px;}

.btn_g:hover, .btn_g:active,
a.btn_g:hover, a.btn_g:active {
  background: #fff;
  background: linear-gradient(top, #f2f2f2, #fff);
  background: -ms-linear-gradient(top, #f2f2f2, #fff);
  background: -moz-linear-gradient(top, #f2f2f2, #fff);
  background: -webkit-linear-gradient(top, #f2f2f2, #fff);
  background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#fff));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f2f2f2,EndColorStr=#ffffff);
}

.btn_d, a.btn_d {
  background: url(../../common/img/pc_arw1.png) no-repeat 0 50%;
  font-weight: bold; text-decoration: none;
  padding: 2px 0 2px 24px;
}
.btn_d:hover, a.btn_d:hover,
.btn_d:active, a.btn_d:active { background: url(../../common/img/pc_arw0.png) no-repeat 0 50%;}

a.btn_e {
  display: inline-block;
  width: 360px;
  background: #ffddc6;
  border-bottom: 2px solid #ffb98a;
  color: #f60; font-size: 86%; text-align: center; text-decoration: none;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 6px 10px;
  *display: inline; *zoom: 1;
}
a.btn_e img { height: 40px;}
a.btn_e:hover, a.btn_e:active { background-color: #ffd1b3;}
a.btn_e:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.btn_h, a.btn_h {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  display: inline-block;
  width: 100%;
  background: #fff url(../img/pc_arw_orange0.png) no-repeat 97% 50%;
  text-decoration: none;
  border: 1px solid #ffb380;
  border-bottom-width: 3px;
  border-radius: 6px; -webkit-border-radius: 6px;
  padding: 15px 30px 15px 10px;
  *display: inline; *zoom: 1;
}
.btn_h:hover,
a.btn_h:hover { color: #f60; border-color: #f60;}

.btn_i, a.btn_i {
  background: #e45e65;
  background: linear-gradient(top, #f09b9e, #e45e65);
  background: -ms-linear-gradient(top, #f09b9e, #e45e65);
  background: -moz-linear-gradient(top, #f09b9e, #e45e65);
  background: -webkit-linear-gradient(top, #f09b9e, #e45e65);
  background: -webkit-gradient(linear, left top, left bottom, from(#f09b9e), to(#e45e65));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f09b9e,EndColorStr=#e45e65);
  text-shadow: 0 1px 0 #dc343d;
  border-bottom-color: #dc343d;
}
.btn_i:hover, .btn_i:active,
a.btn_i:hover, a.btn_i:active {
  background: #f09b9e;
  background: linear-gradient(top, #e45e65, #f09b9e);
  background: -ms-linear-gradient(top, #e45e65, #f09b9e);
  background: -moz-linear-gradient(top, #e45e65, #f09b9e);
  background: -webkit-linear-gradient(top, #e45e65, #f09b9e);
  background: -webkit-gradient(linear, left top, left bottom, from(#e45e65), to(#f09b9e));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#e45e65,EndColorStr=#f09b9e);
}

.btn_disabled {
  background: #e5e5e5;
  background: linear-gradient(top, #ebebeb, #e5e5e5);
  background: -ms-linear-gradient(top, #ebebeb, #e5e5e5);
  background: -moz-linear-gradient(top, #ebebeb, #e5e5e5);
  background: -webkit-linear-gradient(top, #ebebeb, #e5e5e5);
  background: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#e5e5e5));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ebebeb,EndColorStr=#e5e5e5);
  border-bottom-color: #ccc;
  color: #b2b2b2; text-shadow: 0 1px 0 #fff;
}

.btn_more { text-align: right; padding: 0 10px 0 0;}
.btn_more a { display: inline-block; *display: inline; *zoom: 1;}

.line_more { padding: 0; margin: 0;}
.line_more a, .line_more2 a {
  display: block;
  text-indent: -9999px; text-decoration: none;
  border-bottom: 1px solid #ffc49d;
  padding: 10px;
}
.line_more a { background: #ffe3d0 url(../../common/img/pc_btn_more2.png) no-repeat 50% 50%;}
.line_more2 a { background: #ffe3d0 url(../../common/img/pc_btn_more3.png) no-repeat 50% 50%;}
.line_more a:hover, .line_more a:active,
.line_more2 a:hover, .line_more2 a:active { background-color: #ffd1b3;}

@media screen and (max-width: 767px) {
.btn_area.half, .form_btn.half { width: 300px;}

.btn_disabled, .btn_a, .btn_b, .btn_c, .btn_f, .btn_g, .btn_i { width: 240px; height: 44px; font-size: 100%; border-bottom-width: 2px; border-radius: 4px; -webkit-border-radius: 4px;}
.btn_disabled, a.btn_a, a.btn_b, a.btn_c, a.btn_f, a.btn_g, a.btn_i { width: 230px; height: 38px; line-height: 38px;}
.half .btn_disabled, .half .btn_a, .half .btn_b, .half .btn_c, .half .btn_f, .half .btn_g, .half .btn_i { width: 145px;}
.half .btn_disabled, .half a.btn_a, .half a.btn_b, .half a.btn_c, .half a.btn_f, .half a.btn_g, .half a.btn_i { width: 135px;}

.btn_area.half span:first-child, .form_btn.half span:first-child,
.btn_area.half input:first-child, .form_btn.half input:first-child,
.btn_area.half button:first-child, .form_btn.half button:first-child,
.btn_area.half a:first-child, .form_btn.half a:first-child { margin-right: 10px;}

.btn_more { padding-right: 0;}
.btn_more a { color: #f60;}

.line_more, .line_more2 { padding: 0; margin: 0 -10px;}
.line_more a, .line_more2 a { padding: 6px;}
.line_more a { background: #ffe3d0 url(../../common/img/btn_more2.png) no-repeat 50% 50%; background-size: auto 20px; -webkit-background-size: auto 20px;}
.line_more2 a { background: #ffe3d0 url(../../common/img/btn_more3.png) no-repeat 50% 50%; background-size: auto 20px; -webkit-background-size: auto 20px;}

.btn_d, a.btn_d {
  display: inline-block;
  background: #ffddc6 url(../../common/img/arw0.png) no-repeat 15px 50%;
  background-size: auto 14px; -webkit-background-size: auto 14px;
  border-bottom: 2px solid #ffb98a;
  color: #f60; font-size: 86%; font-weight: normal;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 4px 10px 4px 32px;
  *display: inline; *zoom: 1;
}
.btn_d:hover, .btn_d:active,
a.btn_d:hover, a.btn_d:active {
  background: #ffd1b3 url(../../common/img/arw0.png) no-repeat 15px 50%;
  background-size: auto 14px; -webkit-background-size: auto 14px;
}
.btn_d:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.btn_g, a.btn_g { box-shadow: 0 2px 0 #ccc; -webkit-box-shadow: 0 2px 0 #ccc;}
.btn_g { width: 238px; height: 42px;}
a.btn_g { width: 228px; height: 36px; line-height: 36px;}
.half .btn_g { width: 145px;}
.half a.btn_g { width: 133px;}


a.btn_e { width: 280px;}
a.btn_e img { height: 34px;}

.btn_h, a.btn_h {
  background-image: url(../img/arw_orange0.png);
  background-position: 100% 50%;
  background-size: auto 10px; -webkit-background-size: auto 10px;
}
}

/* ------------------ contents new button */

.btn2, a.btn2, .btn2_arw, a.btn2_arw {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  display: inline-block;
  height: 36px;
  background: #ccc;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  line-height: 36px;
  border-radius: 4px; -webkit-border-radius: 4px;
  border-bottom: 3px solid #aaa;
  padding: 0 10px;
}
button.btn2 {
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 0;
}
.btn2_arw, a.btn2_arw {
  background: #ccc url(../img/pc_arw5.png) no-repeat 100% 50%;
  padding: 0 38px 0 10px;
}
.btn2_arw.ac, a.btn2_arw.ac { padding-left: 38px;}
.h_big, a.h_big { font-size: 24px; height: 60px; line-height: 60px;}
.btn2.h_big, a.btn2.h_big { padding: 0 20px;}
.btn2_arw.h_big, a.btn2_arw.h_big { background-position: 96% 50%; padding: 0 50px 0 20px;}
.btn2_arw.h_big.ac, a.btn2_arw.h_big.ac { padding-left: 50px;}
.btn_full, a.btn_full { width: 100%;}
.btn2.red, .btn2_arw.red      { background-color: #ff5959; border-color: #cc0000;}
.btn2.orange, .btn2_arw.orange    { background-color: #ff802b; border-color: #c64c09;}
.btn2.pink, .btn2_arw.pink      { background-color: #fd7a6d; border-color: #d85555;}
.btn2.pink2,.btn2_arw.pink2      { background-color: #ff898d; border-color: #d85555;}
.btn2.yellow, .btn2_arw.yellow    { background-color: #e8b723; border-color: #cc9211;}
.btn2.yellow2, .btn2_arw.yellow2  { background-color: #ffb011; border-color: #c4810a;}
.btn2.y-green, .btn2_arw.y-green  { background-color: #a1cf25; border-color: #89af14;}
.btn2.blueGreen, .btn2_arw.blueGreen  { background-color: #49d1ca; border-color: #30a59f;}
.btn2.green, .btn2_arw.green    { background-color: #4dac00; border-color: #37990a;}
.btn2.sky, .btn2_arw.sky      { background-color: #5ab1de; border-color: #3584a8;}
.btn2.blue, .btn2_arw.blue      { background-color: #3988e8; border-color: #1b64bc;}
.btn2.ltBlue, .btn2_arw.ltBlue    { background-color: #73c2f5; border-color: #4c9cd1;}
.btn2.purple, .btn2_arw.purple    { background-color: #bb79da; border-color: #8958bc;}
.btn2.fb, .btn2_arw.fb        { background-color: #4866a4; border-color: #365387;}
.btn2.tw, .btn2_arw.tw        { background-color: #70b6ea; border-color: #5b9fc9;}
.btn2.suisen1, .btn2_arw.suisen1  { background-color: #86d0ef; border-color: #5fb3d7;}
.btn2.suisen2, .btn2_arw.suisen2  { background-color: #67c4eb; border-color: #449ec5;}
.btn2.suisen3, .btn2_arw.suisen3  { background-color: #48b7e6; border-color: #2491c0;}
.btn2.suisen4, .btn2_arw.suisen4  { background-color: #29abe2; border-color: #1587b7;}
.btn2.suisen5, .btn2_arw.suisen5  { background-color: #ff95bb; border-color: #c66d91;}
.btn2:hover img, a.btn2:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.btn2.red:hover, .btn2_arw.red:hover      { background-color: #ff3636;}
.btn2.orange:hover, .btn2_arw.orange:hover    { background-color: #ff5a15;}
.btn2.pink:hover, .btn2_arw.pink:hover      { background-color: #fc675a;}
.btn2.pink2:hover,.btn2_arw.pink2:hover      { background-color: #fc675a;}
.btn2.yellow:hover, .btn2_arw.yellow:hover    { background-color: #db9810;}
.btn2.yellow2:hover, .btn2_arw.yellow2:hover  { background-color: #ff8f07;}
.btn2.y-green:hover, .btn2_arw.y-green:hover  { background-color: #7db812;}
.btn2.blueGreen:hover, .btn2_arw.blueGreen:hover  { background-color: #44c5bd;}
.btn2.green:hover, .btn2_arw.green:hover    { background-color: #2d8a00;}
.btn2.sky:hover, .btn2_arw.sky:hover      { background-color: #3790cd;}
.btn2.blue:hover, .btn2_arw.blue:hover      { background-color: #1e62db;}
.btn2.ltBlue:hover, .btn2_arw.ltBlue:hover    { background-color: #6eb7e7;}
.btn2.purple:hover, .btn2_arw.purple:hover    { background-color: #9d53c7;}
.btn2.fb:hover, .btn2_arw.fb:hover        { background-color: #294181;}
.btn2.tw:hover, .btn2_arw.tw:hover        { background-color: #4a96de;}
.btn2.suisen1:hover, .btn2_arw.suisen1:hover  { background-color: #7ec7e6;}
.btn2.suisen2:hover, .btn2_arw.suisen2:hover  { background-color: #5cb9e0;}
.btn2.suisen3:hover, .btn2_arw.suisen3:hover  { background-color: #3ca9d7;}
.btn2.suisen4:hover, .btn2_arw.suisen4:hover  { background-color: #219ed4;}
.btn2.suisen5:hover, .btn2_arw.suisen5:hover  { background-color: #f089ac;}


@media screen and (max-width: 767px) {
.btn2, a.btn2, .btn2_arw, a.btn2_arw {
  height: auto;
  font-size: 14px;
  line-height: 100%;
  padding: 6px 10px;
}
.btn2_arw, a.btn2_arw {
  background-size: auto 14px; -webkit-background-size: auto 14px;
  padding-right: 34px;
}
.btn2_arw.ac, a.btn2_arw.ac { padding-left: 38px;}
.h_big, a.h_big { font-size: 20px; height: 50px; line-height: 50px;}
.btn2.h_big, a.btn2.h_big { padding: 0 20px;}
.btn2_arw.h_big, a.btn2_arw.h_big { background-position: 96% 50%; padding: 0 40px 0 10px;}
.btn2_arw.h_big.ac, a.btn2_arw.h_big.ac { padding-left: 50px;}
}

/* ------------------ stitch white button */
.btn3stitch {
  display: block;
  box-sizing: border-box;
  height: 36px;
  line-height: 36px;
  padding: 0 5px;
  border: 2px dashed #999;
  border-radius: 3px; -webkit-border-radius: 3px;
  color: #666;
}
@media all and (-ms-high-contrast:none){
  .btn3stitch { line-height: 32px;}/* IEの文字位置修正*/
}
@supports (-ms-ime-align: auto) {
  .btn3stitch { line-height: 32px;}/* Edgeの文字位置修正*/
}
.btn3, a.btn3 {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  display: inline-block;
  background: #fff;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  text-decoration: none;
  border-radius: 5px; -webkit-border-radius: 5px;
  box-shadow: 0 2px 0 0 rgba(0,0,0,.15);
  border: 4px solid #fff;
}
.btn3:hover, a.btn3:hover { background: #f4f4f4; border-color: #f4f4f4;}

button.btn3 {
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 0;
}
.btn_full, a.btn_full { width: 100%;}
.orange .btn3stitch  { color: #FB5A00; border-color: #FF8C00;}
.green .btn3stitch  { color: #009245; border-color: #39B54A;}

@media screen and (max-width: 767px) {
  .btn3, a.btn3, .btn3_arw, a.btn3_arw {
    font-size: 14px;
  }
}

/* ------------------ reg_box_a, reg_box_b */

.pf_btn,
.reg_box_b,
.reg_box_a {
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  text-align: center;
  padding-bottom: 60px;
}
.pf_btn .reg_btn,
.reg_box_b .reg_btn,
.reg_box_a .reg_btn { position: relative;}
.pf_btn .reg_btn { padding-top: 20px;}
.pf_btn .btn2_arw,
.reg_box_b .btn2_arw,
.reg_box_a .btn2_arw { position: relative; width: 300px;}

.reg_box_a .reg_txt_t {
  color: #66523f;
  font-size: 18px;
  padding-bottom: 10px;
}
.reg_box_a .reg_txt_t:before,
.reg_box_a .reg_txt_t:after {
  display: inline-block;
  content: "";
  width: 26px;
  height: 40px;
  background: no-repeat;
  vertical-align: middle;
}
.reg_box_a .reg_txt_t:before { background-image: url(../../portal/img/balloon_line_left2.png);}
.reg_box_a .reg_txt_t:after { background-image: url(../../portal/img/balloon_line_right2.png);}
.reg_box_a .reg_txt_t p { display: inline-block; vertical-align: middle; padding: 0 20px 5px;}
.reg_box_b .reg_btn { padding-top: 10px;}
.pf_btn .reg_btn .btn2_arw,
.reg_box_b .reg_btn .btn2_arw,
.reg_box_a .reg_btn .btn2_arw { width: 400px;}
.pf_btn .btn2_arw:before,
.reg_box_a .btn2_arw:before {
  position: absolute;
  top: -25px;
  left: -25px;
  content: "";
  width: 66px;
  height: 66px;
  background: url(../../common/img/pc_reg_free.png) no-repeat;
}
.reg_box_b .reg_txt_b,
.reg_box_a .reg_txt_b { color: #ff781e; font-size: 18px; padding-top: 20px;}
.reg_box_b .reg_txt_b br,
.reg_box_a .reg_txt_b br { display: none;}

.reg_box_b .reg_btn { padding-top: 25px;}
.reg_box_b .reg_btn:before {
  position: absolute;
  content: "";
  top: -10px;
  left: 50%;
  width: 116px;
  height: 100px;
  background: url(../../common/img/pc_reg_step2.png) no-repeat;
  z-index: 1;
  margin-left: -320px;
}

@media screen and (max-width: 767px) {
.pf_btn,
.reg_box_b,
.reg_box_a { padding-bottom: 20px;}
.pf_btn .reg_btn { padding-bottom: 10px;}
.reg_box_a .reg_txt_t { font-size: 14px;}
.reg_box_a .reg_txt_t:before,
.reg_box_a .reg_txt_t:after {
  width: 20px;
  height: 28px;
  background-size: auto 28px; -webkit-background-size: auto 28px;
}
.reg_box_a .reg_txt_t p { padding: 0 10px;}
.reg_box_b .reg_txt_b,
.reg_box_a .reg_txt_b { font-size: 14px; padding-top: 10px;}
.reg_box_b .reg_txt_b br,
.reg_box_a .reg_txt_b br { display: inline;}
.pf_btn .reg_btn .btn2_arw,
.reg_box_b .reg_btn .btn2_arw,
.reg_box_a .reg_btn .btn2_arw { width: 300px;}
.reg_box_b .reg_btn .btn2_arw.h_big.ac { padding:0 30px 0 25px;}
.pf_btn .btn2_arw:before,
.reg_box_a .btn2_arw:before {
  position: absolute;
  top: -20px;
  left: -10px;
  content: "";
  width: 55px;
  height: 55px;
  background: url(../../common/img/reg_free.png) no-repeat;
  background-size: 55px auto; -webkit-background-size: 55px auto;
}
.reg_box_b .reg_btn { padding-top: 10px;}
.reg_box_b .reg_btn:before { display: none;}

.reg_box_b .hide_pc { display: inline-block;}
}


/* ------------------ contents box */

.box_section {
  background: #fff;
  border: 1px solid #ffb98a;
  border-radius: 6px; -webkit-border-radius: 6px;
  padding: 10px;
}
.box_a { background: #f3dac5; padding: 5px; margin: 0 0 10px;}
.box_a .box_inner { background: #fff; border: 1px solid #edc6a5; padding: 10px;}
.box_b { margin: -10px 0 10px;}
.box_b .box_inner { background: #fff; padding: 10px; border-bottom: 1px solid #ffc49d;}
.box_c { background: #fff2ea; border: 1px solid #fec9a5; padding: 10px;}

.table_c, .table_a { width: 100%; border-collapse: separate; border-spacing: 1px;}
.table_c th, .table_c td,
.table_a th, .table_a td { vertical-align: top; padding: 5px 0 5px 10px;}
.table_a th, .table_c th { width: 36%; color: #92521d; text-align: center; vertical-align: middle; padding: 5px;}
.table_a th { background: #fff9d5;}
.table_c th { background: #fff3d9;}
.table_b { width: 100%; background: #fff; border: 1px solid #ffb98a;}
.table_b th, .table_b td { border-bottom: 1px solid #ffb98a; padding: 10px;}
.table_b th { width: 40%; background: #ffeee3; color: #f80;}

@media screen and (max-width: 767px) {
.box_section { background: inherit; border: none; padding: 0; border-radius: 0; -webkit-border-radius: 0;}
.box_c { background: #fff; border: none;}
.box_b { margin: -10px -10px 10px;}
.box_b2 { margin: 0 -10px;}
}

/* ------------------ contents line_area */

.line_areaA { margin: 0 0 10px;}
.line_box li { background: #fff; border-bottom: 1px solid #ffc49d;}
.line_box li a { display: table; width: 100%; color: #333; text-decoration: none;}
.line_box li a:hover { background-color: #fff1e8;}
.line_areaB li a {
  display: block;
  background: url(../img/pc_arw_orange0.png) no-repeat 98% 50%;
  padding: 10px 0;
}
.line_box li span { display: table-cell; vertical-align: middle; padding: 5px;}
.line_areaB li span { display: inline-block;}
.line_box .time_area { width: 50px; text-align: center;}
.line_box .time_area { color: #999;}
.line_box .rank_area { width: 36px; text-align: center;}
.line_box .rank_area img { height: 30px;}
.rank1, .rank_area.rank1 { color: #d8860c; font-weight: bold;}
.rank2, .rank_area.rank2 { color: #666; font-weight: bold;}
.rank3, .rank_area.rank3 { color: #c2644e; font-weight: bold;}
.line_box .img_area { position: relative; width: 50px; height: 50px; text-align: center; vertical-align: middle;}
.line_box .img_area > span { display: inline-block; width: 50px; padding: 0; overflow: hidden;}
.line_box .img_area img {
  max-width: 50px; width: expression(this.width >= this.height ? "50px" : "auto");
  max-height: 50px; height: expression(this.width <= this.height ? "50px" : "auto");
  vertical-align: middle;
}
.line_box .title_area { width: auto; /*max-width: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;*/}
.line_box .num_area { width: 50px; text-align: right; padding-right: 20px;}
.line_box .stamp_area { width:  50px; text-align: center;}
.line_box .stamp_area img { height: 40px;}

.line_box a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

@media screen and (max-width: 767px) {
.line_areaA { margin: 0 -10px 10px;}
.line_areaB { margin: 0 -10px;}
.line_areaB li a {
  background: url(../img/arw_orange0.png) no-repeat 100% 50%;
  background-size: auto 10px; -webkit-background-size: auto 10px;
}

.line_box li span { padding: 0;}
.line_box .rank_area { padding-left: 5px;}
.line_box .rank_area img { height: 30px;}
.line_box .img_area { width: 40px; height: 40px; padding: 5px;}
.line_box .img_area > span { width: 40px;}
.line_box .img_area img {
  max-width: 40px; width: expression(this.width >= this.height ? "40px" : "auto");
  max-height: 40px; height: expression(this.width <= this.height ? "40px" : "auto");
}
.line_box .num_area { padding-right: 10px;}
}

/* ------------------ contents tab */


.tab_list1 { float: none; overflow: hidden; margin-bottom: -2px;}
.tab_list1 li {
  display: block; width: 50%;
  text-align: center;
  cursor: pointer;
}
.tab_list1 .tab0 { float: left;}
.tab_list1 .tab1 { float: right;}
.tab_list1 li img { display: none; line-height: 100%;}
.tab_list1 li a {
  display: block; height: 32px;
  background: transparent no-repeat 50% 50%;
  border-radius: 6px 6px 0 0 ; -webkit-border-radius: 6px 6px 0 0;
  padding: 5px;
  margin: 0 10px;
}
.tab_list1 .tab0 a { background-color: #ffd922; background-image: url(../img/pc_tab_ehon_off.png);}
.tab_list1 .tab1 a { background-color: #4bde74; background-image: url(../img/pc_tab_uta_off.png);}
.tab_list1 .tab0.open a,
.tab_list1 .tab1.open a { background-color: #fff; border: 1px solid transparent; margin: 0;}
.tab_list1 .tab0.open a { background-image: url(../img/pc_tab_ehon_on.png); border-color: #ffd922; border-bottom-color: #fff;}
.tab_list1 .tab1.open a { background-image: url(../img/pc_tab_uta_on.png); border-color: #4bde74; border-bottom-color: #fff;}

.tab_box1 {
  background: #fff;
  border: 1px solid transparent;
  border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px;
  padding: 20px;
  overflow: hidden;
}
.tab_box1.ehon { border-color: #ffd922; border-radius: 0 6px 6px 6px ; -webkit-border-radius: 0 6px 6px 6px;}
.tab_box1.uta { border-color: #4bde74; border-radius: 6px 0 6px 6px; -webkit-border-radius: 6px 0 6px 6px;}


.tab_list2 {
  display: block;
  width: 263px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 1px; margin: 0 auto;
  overflow: hidden;
}
.tab_list2.bk { width: 395px;}
.tab_list2 li { float: left; padding-left: 1px;}
.tab_list2 li img { height: 16px;}
.tab_list2 li:first-child { padding-left: 0;}
.tab_list2 li a {
  display: block; width: 131px;
  background: #ebebeb;
  text-align: center; text-decoration: none;
  padding: 8px 0;
}
.tab_list2 li a:hover { background: #e6e6e6;}
.tab_list2 li a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}
.tab_list2 li:first-child a { border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px;}
.tab_list2 li:last-child a { border-radius: 0 3px 3px 0; -webkit-border-radius: 0 3px 3px 0;}
.tab_list2 .tab0.open a {
  background: #ffda09;
  background: linear-gradient(top, #ffe344, #ffda09);
  background: -ms-linear-gradient(top, #ffe344, #ffda09);
  background: -moz-linear-gradient(top, #ffe344, #ffda09);
  background: -webkit-linear-gradient(top, #ffe344, #ffda09);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffe344), to(#ffda09));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffe344,EndColorStr=#ffda09);
}
.tab_list2 .tab0.open a:hover, .tab_list2 .tab0.open a:active {
  background: #ffe344;
  background: linear-gradient(top, #ffda09, #ffe344);
  background: -ms-linear-gradient(top, #ffda09, #ffe344);
  background: -moz-linear-gradient(top, #ffda09, #ffe344);
  background: -webkit-linear-gradient(top, #ffda09, #ffe344);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffda09), to(#ffe344));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffda09,EndColorStr=#ffe344);
}
.tab_list2 .tab1.open a {
  background: #28ca34;
  background: linear-gradient(top, #30d63d, #28ca34);
  background: -ms-linear-gradient(top, #30d63d, #28ca34);
  background: -moz-linear-gradient(top, #30d63d, #28ca34);
  background: -webkit-linear-gradient(top, #30d63d, #28ca34);
  background: -webkit-gradient(linear, left top, left bottom, from(#30d63d), to(#28ca34));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#30d63d,EndColorStr=#28ca34);
}
.tab_list2 .tab1.open a:hover, .tab_list2 .tab1.open a:active {
  background: #30d63d;
  background: linear-gradient(top, #28ca34, #30d63d);
  background: -ms-linear-gradient(top, #28ca34, #30d63d);
  background: -moz-linear-gradient(top, #28ca34, #30d63d);
  background: -webkit-linear-gradient(top, #28ca34, #30d63d);
  background: -webkit-gradient(linear, left top, left bottom, from(#28ca34), to(#30d63d));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#28ca34,EndColorStr=#30d63d);
}
.tab_list2 .tab2.open a {
  background: #ee8c8e;
  background: linear-gradient(top, #f0989b, #ee8c8e);
  background: -ms-linear-gradient(top, #f0989b, #ee8c8e);
  background: -moz-linear-gradient(top, #f0989b, #ee8c8e);
  background: -webkit-linear-gradient(top, #f0989b, #ee8c8e);
  background: -webkit-gradient(linear, left top, left bottom, from(#f0989b), to(#ee8c8e));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f0989b,EndColorStr=#ee8c8e);
}
.tab_list2 .tab2.open a {
  background: #f0989b;
  background: linear-gradient(top, #ee8c8e, #f0989b);
  background: -ms-linear-gradient(top, #ee8c8e, #f0989b);
  background: -moz-linear-gradient(top, #ee8c8e, #f0989b);
  background: -webkit-linear-gradient(top, #ee8c8e, #f0989b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ee8c8e), to(#f0989b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ee8c8e,EndColorStr=#f0989b);
}

@media screen and (max-width: 767px) {
.tab_list1 { float: none;}
.tab_list1 li { display: block; width: auto;}
.tab_list1 .tab0, .tab_list1 .tab1 { float: left;}
.tab_list1 li img { display: none;}
.tab_list1 li a { height: auto; border: none; border-radius: 0; -webkit-border-radius: 0; margin: 0;}
.tab_list1 li img { display: inline;}
.tab_list1 .tab0 a, .tab_list1 .tab1 a { background: #ebebeb; border-bottom-color: transparent;}
.tab_list1 .tab0.open a, .tab_list1 .tab1.open a { border-color: transparent;}
.tab_box1 { background: none; border: none; padding: 0; margin-top: 0; overflow: inherit;}

.tab_list1 {
  display: block;
  width: 199px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 1px; margin: 15px auto 0;
}
.tab_list1 li { float: left; padding-left: 1px;}
.tab_list1 li:first-child { padding-left: 0;}

.tab_list1 li a {
  display: block; width: 99px;
  background: #ebebeb;
  text-align: center; text-decoration: none;
}
.tab_list1 li a, .tab_list1 .tab0.open a, .tab_list1 .tab1.open a { border: none; padding: 4px 0;}
.tab_list1 li a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}
.tab_list1 .tab0 a { border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px;}
.tab_list1 .tab1 a { border-radius: 0 3px 3px 0; -webkit-border-radius: 0 3px 3px 0;}
.tab_list1 .tab0.open a {
  background: #ffda09;
  background: linear-gradient(top, #ffe344, #ffda09);
  background: -ms-linear-gradient(top, #ffe344, #ffda09);
  background: -moz-linear-gradient(top, #ffe344, #ffda09);
  background: -webkit-linear-gradient(top, #ffe344, #ffda09);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffe344), to(#ffda09));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffe344,EndColorStr=#ffda09);
}
.tab_list1 .tab0.open a:hover, .tab_list1 .tab0.open a:active {
  background: #ffe344;
  background: linear-gradient(top, #ffda09, #ffe344);
  background: -ms-linear-gradient(top, #ffda09, #ffe344);
  background: -moz-linear-gradient(top, #ffda09, #ffe344);
  background: -webkit-linear-gradient(top, #ffda09, #ffe344);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffda09), to(#ffe344));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffda09,EndColorStr=#ffe344);
}
.tab_list1 .tab1.open a {
  background: #28ca34;
  background: linear-gradient(top, #30d63d, #28ca34);
  background: -ms-linear-gradient(top, #30d63d, #28ca34);
  background: -moz-linear-gradient(top, #30d63d, #28ca34);
  background: -webkit-linear-gradient(top, #30d63d, #28ca34);
  background: -webkit-gradient(linear, left top, left bottom, from(#30d63d), to(#28ca34));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#30d63d,EndColorStr=#28ca34);
}
.tab_list1 .tab1.open a:hover, .tab_list1 .tab1.open a:active {
  background: #30d63d;
  background: linear-gradient(top, #28ca34, #30d63d);
  background: -ms-linear-gradient(top, #28ca34, #30d63d);
  background: -moz-linear-gradient(top, #28ca34, #30d63d);
  background: -webkit-linear-gradient(top, #28ca34, #30d63d);
  background: -webkit-gradient(linear, left top, left bottom, from(#28ca34), to(#30d63d));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#28ca34,EndColorStr=#30d63d);
}

.tab_list2 { width: 197px; border-radius: 4px; -webkit-border-radius: 4px; margin: 5px auto 0;}
.tab_list2.bk { width: 296px;}
.tab_list2 li img { height: 13px;}
.tab_list2 li a { width: 98px; padding: 4px 0;}
}

/* ------------------ contents pager_area */

.pager_area { box-sizing: border-box; -webkit-box-sizing: border-box; display: table; width: 100%; padding: 20px 10px 0;}
.pager_area.foot { padding: 0 10px 20px;}
.pager_area p, .pager_area ul { display: table-cell; vertical-align: bottom; padding: 0; margin: 0;}
.pager_area p strong { color: #f60; font-size: 16px; padding: 0 4px;}
.pager_area .pager_box { text-align: right;}
.pager_box li { display: inline-block;}
.pager_box li a {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  display: inline-block;
  background: #fff no-repeat;
  color: #f79d27;
  line-height: 100%;
  text-align: center;
  text-decoration: none;
  border: 1px solid #f79d27;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 6px 10px;
}
.pager_box .this { color: #f79d27; font-weight: bold; padding: 5px 9px;}
.pager_box .prev a { background-image:url(../img/pc_arw_prev3.png); background-position: -5% 50%; padding-left: 28px;}
.pager_box .next a { background-image:url(../img/pc_arw_next3.png); background-position: 105% 50%; padding-right: 28px;}
.pager_box li a:hover { color: #fff; background-color: #f79d27;}

@media screen and (max-width: 767px) {
.pager_area { display: block; padding: 10px 0 0;}
.pager_area.foot { padding: 5px 0 0;}
.pager_area p, .pager_area ul { display: block;}
.pager_area p { padding-bottom: 5px;}
.pager_area .pager_box { text-align: center;}
}

/* ------------------ contents book_detail */

.book_area { position: relative; display: table; width: 100%; background-color: #fff; border-bottom: 1px solid #ffc49d; overflow: hidden;}

.book_area.registered { background: #d7effd url(../../mbook/img/pc_stamp_yonda.png) no-repeat 67% 100%;}
.book_area.registered_ehon,
.book_area.registered_uta,
.book_area.registered_uta2 { background: #eafde6 url(../../mbook/img/pc_stamp_yonda2.png) no-repeat 67% 100%;}
.book_area.registered_uta { background-image: url(../../mbook/img/pc_stamp_uta.png);}
.book_area.registered_uta2 { background-image: url(../../mbook/img/pc_stamp_uta2.png);}
/*
.book_area.registered_ehon td a,
.book_area.registered_uta td a,
.book_area.registered_uta2 td a,
.book_area.registered td a { color: #333;}
*/

.book_area .photo_area,
.book_area .book_detail,
.book_area .btn_area.half { display: table-cell; vertical-align: top; float: none; padding: 10px;}

.book_area .photo_area,
.book_area .photo_area a { width: 120px; text-align: center;}
.book_area .photo_area a { display: inline-block; text-align: center; *display: inline; *zoom: 1;}
.book_area .photo_area span { display: block; padding-top: 4px;}
.book_area .photo_area .btn_f {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  height: auto;
  font-size: 14px;
  line-height: 100%;
  padding: 6px 5px 8px;
}
.book_area .photo_area img {
  max-width: 120px; width: expression(this.width >= this.height ? "120px" : "auto");
  max-height: 120px; height: expression(this.width <= this.height ? "120px" : "auto");
}
.book_area .book_detail { width: 305px; padding: 10px 0;}
.book_area .book_detail th { width: 70px;}

.book_area .btn_area.half { width: 105px;}
.book_area .btn_area.half span,
.book_area .btn_area.half input,
.book_area .btn_area.half a { box-sizing: border-box; -webkit-box-sizing: border-box; width: 105px; height: 60px; font-size: 100%; line-height: 100%; float: none; padding: 5px 10px; margin: 5px 0;}
.book_area .btn_area.half a.btn_a { padding-top: 21px;}
.book_area .btn_area.half a.btn_b { padding-top: 16px;}
.book_area .btn_area.half .btn_disabled { padding-top: 16px;}

@media screen and (max-width: 767px) {
.book_area { display: block; width: auto; margin: 0 -10px;}
.book_area_sp { display: table; width: 100%;}

.book_area.registered {
  background-image: url(../../mbook/img/stamp_yonda.png);
  background-repeat: no-repeat;
  background-position: 95% 58%;
  background-size: 100px auto; -webkit-background-size: 100px auto;
}

.book_area.registered_ehon,
.book_area.registered_uta,
.book_area.registered_uta2 {
  background-image: url(../../mbook/img/stamp_yonda2.png);
  background-repeat: no-repeat;
  background-position: 95% 58%;
  background-size: 100px auto; -webkit-background-size: 100px auto;
}
.book_area.registered_uta { background-image: url(../../mbook/img/stamp_uta.png);}
.book_area.registered_uta2 { background-image: url(../../mbook/img/stamp_uta2.png);}

.book_area .photo_area,
.book_area .photo_area a { width: 100px;}
.book_area .photo_area img {
  max-width: 100px; width: expression(this.width >= this.height ? "100px" : "auto");
  max-height: 100px; height: expression(this.width <= this.height ? "100px" : "auto");
}
.book_area .photo_area .btn_f { font-size: 12px;}

.book_area .book_detail { width: auto;}
.book_area .book_detail th { width: 54px; font-size: 12px;}

.book_area .btn_area.half { display: block; margin: 0 auto; padding: 0 0 10px;}
.book_area .btn_area.half { width: 300px;}
.book_area .btn_area.half span,
.book_area .btn_area.half input,
.book_area .btn_area.half a { width: 145px; height: 50px; float: right; padding: 5px; margin: 0;}
.book_area .btn_area.half span:first-child,
.book_area .btn_area.half input:first-child,
.book_area .btn_area.half a:first-child { margin-left: 10px;}
.book_area .btn_area.half a.btn_a,
.book_area .btn_area.half a.btn_b,
.book_area .btn_area.half .btn_disabled { padding-top: 16px;}
}

/* ------------------ contents gallery */

.gallery_area { position: relative; padding: 0 24px;}
.gallery_area.uta,
.gallery_area.ehon {
  background: #fff;
  border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px;
  padding: 20px 40px;
}
.gallery_area.ehon { border: 1px solid #ffe344;}
.gallery_area.uta { border: 1px solid #4bde74;}
.gallery_box { margin: 0; overflow: hidden;}
.gallery_box li { height: 80px; text-align: center; float: left; margin: 0 0 20px 40px; overflow: hidden; word-break: break-all;}
.gallery_box a {
  position: relative;
  display: block; width: 80px; height: 80px;
  color: #5b5b5b; font-size: 86%; text-align: center; left: 0;
  overflow: hidden;
}
.gallery_box button { border: none; padding: 0; margin: 0;}
.gallery_box img {
  max-width: 80px; width: expression(this.width >= this.height ? "80px" : "auto");
  max-height: 80px; height: expression(this.width <= this.height ? "80px" : "auto");
  vertical-align: middle;
}
.gallery_box .gallery_b,
.gallery_box .gallery_u { display: table-cell; width: 72px; height: 72px; text-decoration: none; vertical-align: middle; padding: 4px; overflow: hidden;}
.gallery_box .gallery_b:hover,
.gallery_box .gallery_u:hover { opacity: 0.8; filter: alpha(opacity=80); filter: -ms-alpha(opacity=80);}
.gallery_box .gallery_b.noimage { background: url(../../common/img/pc_bg_ehon_nobook.png) no-repeat;}
.gallery_box .gallery_b.original { background: url(../../common/img/pc_bg_ehon_original.png) no-repeat;}
.gallery_box .gallery_u.pink { background: url(../../common/img/pc_bg_uta_pink.png) no-repeat;}
.gallery_box .gallery_u.orange { background: url(../../common/img/pc_bg_uta_orange.png) no-repeat;}
.gallery_box .gallery_u.blue { background: url(../../common/img/pc_bg_uta_blue.png) no-repeat;}
.gallery_box .gallery_u.green { background: url(../../common/img/pc_bg_uta_green.png) no-repeat;}

.gallery_pager { position: absolute; top: 76px; /*margin-top: -15px;*/ margin-top: -30px;}
.gallery_area.ehon .gallery_pager, .gallery_area.uta .gallery_pager { top: 48px;}
.gallery_pager.prev { left: 10px;}
.gallery_pager.next { right: 10px;}
.gallery_area.ehon .gallery_pager.prev, .gallery_area.uta .gallery_pager.prev { left: 20px;}
.gallery_area.ehon .gallery_pager.next, .gallery_area.uta .gallery_pager.next { right: 20px;}
.gallery_pager img { height: 45px;}

@media screen and (max-width: 767px) {
  .gallery_area { padding: 0 24px;}
  .gallery_area.uta,
  .gallery_area.ehon {
    width: 242px;
    border-radius: 4px; -webkit-border-radius: 4px;
    padding: 10px 28px;
    margin: 0 auto;
  }
  .gallery_box li { height: 54px; margin: 0 0 10px 5px;}
  .gallery_box a { width: 54px; height: 54px; font-size: 65%;}
  .gallery_box img {
    max-width: 54px; width: expression(this.width >= this.height ? "54px" : "auto");
    max-height: 54px; height: expression(this.width <= this.height ? "54px" : "auto");
  }
  .gallery_box .gallery_b,
  .gallery_box .gallery_u { width: 50px; height: 50px; padding: 2px;}
  .gallery_box .gallery_b.noimage { background: url(../../common/img/bg_ehon_nobook.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}
  .gallery_box .gallery_b.original { background: url(../../common/img/bg_ehon_original.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}
  .gallery_box .gallery_u.pink { background: url(../../common/img/bg_uta_pink.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}
  .gallery_box .gallery_u.orange { background: url(../../common/img/bg_uta_orange.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}
  .gallery_box .gallery_u.blue { background: url(../../common/img/bg_uta_blue.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}
  .gallery_box .gallery_u.green { background: url(../../common/img/bg_uta_green.png) no-repeat; background-size: auto 54px; -webkit-background-size: auto 54px;}

  .gallery_pager { top: 42px; margin-top: -20px;}
  .gallery_area.ehon .gallery_pager, .gallery_area.uta .gallery_pager { top: 32px;}
  .gallery_pager.prev { left: -14px;}
  .gallery_pager.next { right: -14px;}
  .gallery_area.ehon .gallery_pager.prev, .gallery_area.uta .gallery_pager.prev { left: -10px;}
  .gallery_area.ehon .gallery_pager.next, .gallery_area.uta .gallery_pager.next { right: -10px;}
}

/* gallery_boxをレスポンシブ化 */
.gallery_area2 { position: relative; margin: 20px auto 0; padding: 0 24px;}
.gallery_area2.uta,
.gallery_area2.ehon {
  background: #fff;
  border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px;
  padding: 20px 40px;
}
.gallery_area2.ehon { border: 1px solid #ffe344;}
.gallery_area2.uta { border: 1px solid #4bde74;}
.gallery_box2 { margin: 0; overflow: hidden;}
/*.gallery_box2 li { height: 80px; text-align: center; float: left; margin: 0 0 20px 40px; overflow: hidden; word-break: break-all;}*/
.gallery_box2 li { height: 80px; text-align: center; float: left; margin: 0 0 20px 20px; overflow: hidden; word-break: break-all;}
.gallery_box2 a {
  position: relative;
  display: block; width: 80px; height: 80px;
  color: #5b5b5b; font-size: 86%; text-align: center; left: 0;
  overflow: hidden;
}
.gallery_box2 button { border: none; padding: 0; margin: 0;}
.gallery_box2 .img {
  display: block;
  width: 100%; height: 0;
  padding-top: 100%;
  background: no-repeat center;
  background-size: contain;
  color: transparent;
}
.img.noimage { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_ehon_nobook.png);}
.img.original { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_ehon_original.png);}
.img.pink { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_uta_pink.png);}
.img.orange { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_uta_orange.png);}
.img.blue { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_uta_blue.png);}
.img.green { background-image: url(https://mi-te.kumon.ne.jp/common/img/pc_bg_uta_green.png);}
.uta_txt {
  display: block;
  margin: auto;
  padding: 5px;
  position: absolute; top: 50%; left: 0; right: 0;
  transform: translateY(-50%);
}
.gallery_pager { position: absolute; top: 76px; /*margin-top: -15px;*/ margin-top: -30px;}
.gallery_area2.ehon .gallery_pager, .gallery_area2.uta .gallery_pager { top: 48px;}
.gallery_pager.prev { left: 10px;}
.gallery_pager.next { right: 10px;}
.gallery_area2.ehon .gallery_pager.prev, .gallery_area2.uta .gallery_pager.prev { left: 20px;}
.gallery_area2.ehon .gallery_pager.next, .gallery_area2.uta .gallery_pager.next { right: 20px;}
.gallery_pager img { height: 45px;}

@media screen and (max-width: 767px) {
  .gallery_area2 {
    max-width: 400px;
    margin-top: 0;
    padding: 20px;
    }
  .gallery_area2.uta,
  .gallery_area2.ehon {
    width: 242px;
    border-radius: 4px; -webkit-border-radius: 4px;
    padding: 10px 28px;
    margin: 0 auto;
  }
  .gallery_box2 li {
    box-sizing: border-box;
    width: 25%;
    height: auto;
    margin: 0;
    padding: 2%;
    }
  .gallery_box2 a {
    width: auto;
    height: auto;
    font-size: 65%;
    }
  .gallery_box2 img {
    max-width: auto; width: 100%;
    max-height: auto; height: auto;
  }
  .gallery_pager { top: 42px; margin-top: -20px;}
  .gallery_area2.ehon .gallery_pager, .gallery_area2.uta .gallery_pager { top: 32px;}
  .gallery_pager.prev { left: -14px;}
  .gallery_pager.next { right: -14px;}
  .gallery_area2.ehon .gallery_pager.prev, .gallery_area2.uta .gallery_pager.prev { left: -10px;}
  .gallery_area2.ehon .gallery_pager.next, .gallery_area2.uta .gallery_pager.next { right: -10px;}
}

.gallery_list { text-align: center;}
.gallery_list li {
  display: inline-block; width: 10px; height: 10px;
  background: #ccc;
  text-indent: -9999px;
  border-radius: 5px; -webkit-border-radius: 5px;
  margin: 0 5px;
  *display: inline; *zoom: 1;
}
.ehon .gallery_list .this { background: #ffe344;}
.uta .gallery_list .this { background: #4bde74;}


/* ------------------ contents text */

.inner_link0 h2 { color: #4a4a4a; font-weight: bold;}
.inner_link0 h2 img { height: 22px; margin: -4px 4px 0 0;}
.inner_link0 ul {
  background: #fff;
  border: 1px solid #ffc49d;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 4px 0 4px 20px; margin: 4px 0 0;
  overflow: hidden;
}
.inner_link0 li { float: left; padding: 2px 15px 2px 0;}
.inner_link0 a {
  display: inline-block;
  background: url(../img/pc_arw1.png) no-repeat 0 50%;
  color: #ff8537; font-size: 86%; font-weight: bold; text-decoration: none;
  padding: 2px 0 2px 24px;
}
.inner_link0 a:hover { color: #f60;}

.txt_link_box { text-align: right; padding: 0;}
.txt_link_box li {
  display: inline-block;
  background: url(../img/pc_arw1.png) no-repeat 0 50%;
  line-height: 100%;
  padding: 4px 10px 4px 24px;
  *display: inline; *zoom: 1;
}
.txt_link_box li a { text-decoration: none;}

.attention_txt { display: block; color: #ff4848; font-size: 86%; padding: 5px 0;}
.attention_txt.content_attention_txt { padding: 5px 15px 5px; }
.bold_red{ color: #ff4848; font-weight:bold;}
.normal_red{ color: #ff4848;}

.error_box { border-bottom: 1px dotted #999; padding-bottom: 5px; margin-bottom: 10px; overflow: hidden;}
.error_area {
  color: #d80b0b;
  text-align: center;
  background: #fff;
  border-bottom: 1px solid #ffb98a;
  padding: 5px 10px;
  margin: 0 0 10px;
  overflow: hidden;
}
.error_area { padding: 5px 0;}
.error_area span { display: block;}
.error_area .btn_area { padding-top: 0;}

.error_area0 { color: #f30; font-size: 86%; border: 1px dotted #f30; padding: 5px; margin-bottom: 10px;}
.error_area0 p { padding: 2px 0;}
.error_area0 p:before { content: "※";}

.error_txt { display: block; color: #d80b0b; font-size: 86%; padding: 0 0 6px; margin-top: -6px;}
.error_txt li { padding: 0 0 2px;}
.error_txt li:before { content: "※";}

@media screen and (max-width: 767px) {
.inner_link0 h2 { padding-top: 10px;}
.inner_link0 h2 img { height: 20px;}
.inner_link0 ul { padding: 5px 0 8px 10px; margin: 2px 0 -5px;}
.inner_link0 a {
  background: url(../img/arw1.png) no-repeat 0 50%;
  background-size: auto 14px; -webkit-background-size: auto 14px;
  text-decoration: underline; font-weight: normal; padding-left: 18px;
}

.txt_link_box li {
  background: url(../img/arw0.png) no-repeat 0 0.3em;
  background-size: auto 14px; -webkit-background-size: auto 14px;
  padding: 3px 10px 3px 18px;
}
.txt_link_box li a { text-decoration: underline;}

.error_area { margin: 0 -10px 10px;}
}

/* ------------------ pager */

.pager { text-align: center; padding: 30px 0; clear: both;}
.pager .prev, .pager .next, .pager ul { display: inline-block; padding: 0; *display: inline; *zoom: 1;}
.pager li { display: inline-block; padding: 0 2px; *display: inline; *zoom: 1;}
.pager .next { float: right;}
.pager .prev { float: left;}
.pager .prev a, .pager .next a, .pager li a {
  display: inline-block;
  min-width: 16px;
  background: #fff;
  color: #f79c24; text-align: center; text-decoration: none; line-height: 100%;
  border: 1px solid transparent;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding: 8px;
  *display: inline; *zoom: 1;
}
.pager li a { border-color: #f79c24;}
.pager .check a { background-color: #f79c24; color: #fff; border-color: transparent;}
.pager .check a:hover,
.pager li a:hover { background-color: #f60; color: #fff; border-color: transparent;}

.pager .prev a { background: url(../img/pc_arw_prev3.png) no-repeat 0 50%; padding-left: 30px; padding-right: 14px;}
.pager .next a { background: url(../img/pc_arw_next3.png) no-repeat 100% 50%; padding-right: 30px; padding-left: 14px;}
.pager .prev a,
.pager .next a { color: #fff; background-color: #f79c24;}
.pager .prev a:hover,
.pager .next a:hover { background-color: #f60;}

@media screen and (max-width: 767px) {
.pager { font-size: 86%; padding: 20px 0;}
.pager li { padding: 0 1px;}
.pager .prev a, .pager .next a, .pager li a { min-width: inherit;}
.pager .prev a {
  background-image: url(../img/arw_prev3.png);
  background-size: auto 14px; -webkit-background-size: auto 14px;
  padding-left: 30px; padding-right: 10px;
}
.pager .next a {
  background-image: url(../img/arw_next3.png);
  background-size: auto 14px; -webkit-background-size: auto 14px;
  padding-right: 30px; padding-left: 10px;
}
}

/* ------------------ navi */

.navi { width: 180px; float: right; padding: 0;}

.nav_news0, .nav_news1, .nav_news2, .nav_kiroku, .nav_banner, .nav_faq {
  position: relative;
  background: #fff;
  border: 1px solid #ffc097;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.nav_news2, .nav_banner { border-color: #7dcdf4;}
.nav_kiroku { border-color: #f99d04; padding-bottom: 0;}
.nav_banner { padding-bottom: 0;}

.nav_news0 h2, .nav_news1 h2, .nav_news2 h2, .nav_kiroku h2, .nav_banner h2, .nav_faq h2 {
  background: #fddb94;
  border-bottom: 1px solid #ffc097;
  border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0;
  padding: 8px 10px;
}
.nav_news2 h2, .nav_banner h2 { background: #f2fafe; border-color: #7dcdf4;}
.nav_kiroku h2 { background: #f3dd14 url(../img/pc_navi_kiroku.png) no-repeat 10px 50%; color: #f60; font-weight: bold; line-height: 100%; border-color: #f99d04; padding-left: 30px;}
.nav_banner h2 { text-align: center; padding: 6px 10px;}
.nav_faq h2 { text-align: center;}
.nav_news0 ul, .nav_news1 ul, .nav_news2 ul { padding: 0 10px 5px;}
.nav_news0 li, .nav_news1 li, .nav_news2 li { font-size: 86%; border-bottom: 1px dotted #ccc; padding: 8px 0;}
.nav_news0 li a, .nav_news1 li a, .nav_news2 li a { display: block; }
.nav_news1 li a { white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.nav_news2 li a { color: #17a0e5;}
.nav_news0 li span, .nav_news1 li span, .nav_news2 li span { display: block; color: #333;}
.nav_news0 p, .nav_news1 p, .nav_news2 p, .nav_kiroku p, .nav_faq p { text-align: right; padding: 5px 10px 0;}
.nav_news0 p a img, .nav_news1 p a img, .nav_news2 p a img, .nav_kiroku p a img, .nav_faq p a img { height: 15px;}

.nav_kiroku .kiroku_list { padding: 0 0 5px; margin: 15px 8px 5px;}
.nav_kiroku .kiroku_list li { color: #666; font-size: 86%; overflow: hidden; padding: 0 0 6px;}
.nav_kiroku .kiroku_list span { float: right; margin-top: -2px;}
.nav_kiroku .kiroku_list strong { color: #f60; font-size: 133%; padding-right: 2px;}
.nav_kiroku .kiroku_list img { vertical-align: middle;}
.nav_kiroku .kiroku_list .trial0 { border-top: 1px dotted #f60; padding: 4px 0 10px; margin: 4px 0 0;}
.nav_kiroku .kiroku_list .trial0 span { color: #0c4cb8; font-weight: bold; padding-top: 2px;}
.nav_kiroku .kiroku_list .trial0 strong { color: #0c4cb8; font-size: 160%;}
.nav_kiroku .kiroku_list .trial1 {
  background: #e6eefd;
  color: #66523f; font-size: 100%; font-weight: bold; text-align: center;
  padding: 6px;
}
.nav_kiroku .kiroku_list .trial1 strong { color: #66523f;}
.nav_kiroku .kiroku_list .trial1 img { height: 28px; margin: -6px 4px 0 0;}


/*  -----  PC 目標設定 チャレンジ設定　----- */

/*.nav_kiroku .kiroku_list .mokuhyo,.nav_kiroku .kiroku_list .yatte { border-top:1px dotted #FF6600; padding-top:6px;}
.nav_kiroku .kiroku_list .mokuhyo span,.nav_kiroku .kiroku_list .yatte span { margin-top:2px;}
.nav_kiroku .kiroku_list .mokuhyo strong,.nav_kiroku .kiroku_list .yatte_num strong { color:#0C4CB8;}
.nav_kiroku .kiroku_list .mokuhyo_num,.nav_kiroku .kiroku_list .yatte_num { position:relative; padding-bottom:0;}
.nav_kiroku .kiroku_list .mokuhyo_num span { position:absolute; top:10px; left:53px; width:70px; height:28px; text-align:center; color:#f60; font-size:133%; font-weight:bold;}
.nav_kiroku .kiroku_list .yatte_num span { position:absolute; top:11px; left:88px; width:70px; height:28px; text-align:center; color:#f60; font-size:133%; font-weight:bold;}*/

.nav_kiroku li.bnr_area { border-top:1px dotted #FF6600; padding:10px 0 0; position:relative;}
.nav_kiroku li.bnr_area a { text-decoration: none; letter-spacing: -0.05em;}
.nav_kiroku li.bnr_area a strong { padding-right: 0;}
.nav_kiroku li .num_mokuhyo1 strong { position:absolute; top:13px; left:64px; font-size:14px; color:#0C4CB8; width:54px; height:10px; text-align:center;}
.nav_kiroku li .num_mokuhyo2 strong { position:absolute; bottom:22px; left:50px; font-size:15px; width:58px; height:10px; text-align:center;}
.nav_kiroku li .num_mokuhyo3 strong { position:absolute; bottom:22px; left:18px; font-size:15px; width:87px; height:10px; text-align:right;}
.nav_kiroku li .num_yatte1 strong { position:absolute; top:14px; left:96px; font-size:16px; color:#0C4CB8; width:24px; height:10px; text-align:center;}
.nav_kiroku li .num_yatte2 strong { position:absolute; bottom:25px; left:80px; font-size:18px; color:#FF6600; width:30px; height:10px; text-align:center;}

.nav_banner { padding-bottom: 12px;}
.nav_banner h2 { margin-bottom: 12px;}
.nav_banner .banner_area { width: 140px; height: 32px; margin: 0 auto; overflow: hidden;}
.nav_banner .banner_area li { float: left;}
.nav_banner .banner_area img { width: 140px; height: 32px;}
.nav_banner .nav_pager li {
  position: absolute;
  top: 58px;
  margin: 0 -10px;
}
.nav_banner .nav_pager .next { right: 0;}
.nav_banner .nav_pager .prev { left: 0;}
/*----- jQuery library css start -----*/
.bx-controls-direction { display: none;}
.bx-wrapper .bx-viewport {
  background-color: transparent;
  box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
  border: none;
}
.bx-wrapper img { margin: 0 auto;}
/*----- jQuery library css end -----*/

.nav_faq dl { font-size: 86%; padding: 0 10px 5px;}
.nav_faq dt { background: url(../img/pc_faq_q.png) no-repeat 0 10px; padding: 10px 0 5px 24px;}
.nav_faq dd {
  background: url(../img/pc_faq_a.png) no-repeat;
  border-bottom: 1px dotted #aaa;
  padding: 0 0 10px 24px;
}

@media screen and (max-width: 767px) {
.navi { width: inherit; float: none;}

.nav_txt { padding: 0 0 10px;}

.nav_news0, .nav_kiroku, .nav_news1, .nav_news2, .nav_banner, .nav_faq { display: none; padding-bottom: 0; margin-bottom: 0;}

.nav_news0 h2, .nav_news1 h2, .nav_news2 h2 { padding: 6px 10px;}
.nav_news0 ul, .nav_news1 ul, .nav_news2 ul { padding: 0;}
.nav_news0 li, .nav_news1 li, .nav_news2 li {
  background: url(../img/arw_orange0.png) no-repeat 100% 50%;
  border-bottom: 1px solid #ffc49d;
  background-size: auto 10px; -webkit-background-size: auto 10px;
  font-size: 100%;
  padding: 8px 25px 8px 10px;
  cursor: pointer;
}
.nav_news0 li:last-child, .nav_news1 li:last-child, .nav_news2 li:last-child { border: none;}
.nav_news0 li span, .nav_news1 li span, .nav_news2 li span { font-size: 86%;}
.nav_news0 p, .nav_news1 p, .nav_news2 p { position: absolute; top: 5px; right: 10px; padding: 0;}

/*
.nav_news1 li { display: none;}
.nav_news1 li:first-child { display: block;}
*/
}

/* ------------------ contents_foot */

.contents_foot { display: none;}

p.pagetop { text-align: right; padding: 30px 0 20px;}
p.pagetop img { height: 18px;}

@media screen and (max-width: 767px) {
.contents_foot { display: block; padding-bottom: 20px;}
.contents_foot ul { text-align: center; padding: 20px 0 10px;}
.contents_foot li { display: inline; font-size: 86%; border-left: 1px solid #333; padding: 0 10px;}
.contents_foot li:first-child { border-left: none;}
.contents_foot a { color: #333; text-decoration: none;}
.contents_foot a:hover { color: #f60; text-decoration: underline;}

p.pagetop { padding: 5px 10px 0;}
.contents .pagetop,
.contents_inner .pagetop { padding: 5px 0 0;}
p.pagetop img { height: 16px;}

.btn_home { padding: 10px 0;}
.btn_home a {
  position: relative;
  display: block;
  background: #ffc49d;
  background: linear-gradient(top, #ffd3b7, #ffc49d);
  background: -ms-linear-gradient(top, #ffd3b7, #ffc49d);
  background: -moz-linear-gradient(top, #ffd3b7, #ffc49d);
  background: -webkit-linear-gradient(top, #ffd3b7, #ffc49d);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffd3b7), to(#ffc49d));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffd3b7,EndColorStr=#ffc49d);
  text-align: center; text-decoration: none;
  padding: 8px;
}
.btn_home a:before, .btn_home a:after { position: absolute; left: 0; display: block; content: ""; width: 100%; height: 2px;}
.btn_home a:before { top: 0; background: url(../../common/img/hl_top.png) repeat-x; background-size: auto 2px; -webkit-background-size: auto 2px;}
.btn_home a:after { bottom: 0; background: url(../../common/img/hl_bottom.png) repeat-x 0 100%; background-size: auto 2px; -webkit-background-size: auto 2px;}
.btn_home a:hover, .btn_home a:active {
  background: #ffd3b7;
  background: linear-gradient(top, #ffc49d, #ffd3b7);
  background: -ms-linear-gradient(top, #ffc49d, #ffd3b7);
  background: -moz-linear-gradient(top, #ffc49d, #ffd3b7);
  background: -webkit-linear-gradient(top, #ffc49d, #ffd3b7);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffc49d), to(#ffd3b7));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffc49d,EndColorStr=#ffd3b7);
}
}

/* ============================== menu */

.popup_screen, .menu_close { display: none;}

.menu_btn li { border-bottom: 1px solid #ff9b57;}
.menu_btn .sp_link { display: none;}
.menu_btn li li { border-top: 1px solid #ffc69f; border-bottom: none;}
.menu_btn li li:first-child { border-top-color: #ff9b57;}
.sub_menu_btn span,
.menu_btn li a {
  display: block;
  background: #fff url(../img/pc_arw_orange0.png) no-repeat 12px 1.3em;
  color: #333; font-size: 86%; text-decoration: none;
  padding: 12px 10px 10px 26px;
  cursor: pointer;
}
.sub_menu_btn span { color: #f60; background: #fff url(../img/pc_arw_down.png) no-repeat 5px 1.1em;}
.sub_menu_btn span.on { background-image: url(../img/pc_arw_up.png);}
.sub_menu_btn span:hover,
.menu_btn li a:hover { color: #f60;}
.menu_btn li li a { background-color: #fff1e8;}

.sub_menu_btn .sub_menu_btn2 span {
  display: block;
  background: #fff url(../img/pc_arw_down.png) no-repeat 5px 1.1em;
  color: #333; font-size: 86%;
  padding: 12px 10px 10px 26px;
}
.sub_menu_btn span span,
.sub_menu_btn span a span { background: none; color: inherit; font-size: inherit; font-weight: inherit; padding: 0;}
.sub_menu_btn .sub_menu_btn2 span.on { background-image: url(../img/pc_arw_up.png);}
.sub_menu_btn span:hover { color: #f60;}
.menu_btn .sub_menu_btn ul { display: none;}
.sub_menu_btn li span {
  display: inline-block;
  background: none;
  color: inherit; font-size: 100%;
  padding: 0;
}
.sub_menu_btn .sub_menu_btn2 span { background-color: #fff1e8;}
.sub_menu_btn .sub_menu_btn2 ul {
  background: #ffdfca;
}
.sub_menu_btn .sub_menu_btn2 ul a {
  background: inherit;
  padding: 10px;
}

.menu_bnr { padding-top: 30px;}
.menu_bnr li { padding-bottom: 10px; line-height: 100%;}

@media screen and (max-width: 767px) {
.menu_close { display: block; padding: 5px 5px 7px; overflow: hidden;}
.menu_close a {
  display: block; width: 50px; height: 34px; float: right;
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
  border-bottom: 2px solid #e95e01;
  color: #fff; font-size: 72%; font-weight: none; text-align: center; text-decoration: none;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding-top: 6px;
}
.menu_close img { display: block; margin: 2px auto 4px;}

.menu_btn { border-top: 2px solid #ff9b57;}
.menu_btn .sp_link { display: block;}
.menu_btn li a {
  background-image: url(../img/arw_orange0.png);
  background-position: 96% 50%;
  background-size: auto 10px; -webkit-background-size: auto 10px; -moz-background-size: auto 10px;
  font-size: 100%; font-weight: normal;
  padding: 10px 30px 10px 15px;
}
.menu_btn li a:hover, .menu_btn li a:active { color: #f60;}

.sub_menu_btn .sub_menu_btn2 span,
.sub_menu_btn span {
  background-image: url(../img/arw_down.png);
  background-position: 94% 50%;
  background-size: auto 16px; -webkit-background-size: auto 16px; -moz-background-size: auto 16px;
  font-size: 100%; font-weight: normal;
  padding: 10px 30px 10px 15px;
}
.sub_menu_btn span span,
.sub_menu_btn span a span { display: inline-block;}
.sub_menu_btn .sub_menu_btn2 span.on,
.sub_menu_btn span.on { background-image: url(../img/arw_up.png);}
.sub_menu_btn .sub_menu_btn2 ul a {
  padding: 10px 15px;
}

.menu_bnr { display: none;}
}

/* くろくまくんのおうちバナー */
.menu_babykumon {
  display: inline-block;
}
@media screen and (min-width: 768px) { /* PC */
  .menu_babykumon {
    margin-top: 10px;
  }
}
@media screen and (max-width: 767px) { /* SP */
  .menu_babykumon {
    position: absolute;
    top: 6px; left: 6px;
  }
}
/* ============================== cv_app */
.cv_appPC {
  margin-bottom: 60px;
}
.cv_appPC.cv_appPC__contentCenter {
  padding-left: 200px;
}
.cv_appPC_catch_wrap {
  display: table;
  margin: auto;
  position: relative;
}
.cv_appPC_baloon {
  width: 150px; height: auto;
  margin: auto;
  position: absolute;
  top: 15px; left: -20px;
  transform: translateX(-100%);
}
.cv_appPC_catch {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 10px;
  padding: 20px 0 10px;
  color: #fa4141;
  text-align: center;
  line-height: 1.5;
  font-size: 22px;
  font-weight: bold;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.cv_appPC_catch::before,
.cv_appPC_catch::after {
  display: block; content: '';
  width: 2px; height: 3em;
  border-radius: 1px;
  background: currentColor;
}
.cv_appPC_catch::before {
  transform: rotate(-30deg);
}
.cv_appPC_catch::after {
  transform: rotate(30deg);
}
.cv_appPC_qrUnit {
  display: flex;
  justify-content: center;
  gap: 100px;
  margin: auto;
}
.cv_appPC_qr {
  padding: 15px;
  border-radius: 10px;
  background: #fff;
}
.cv_appPC_qr.cv_appPC_qr__beige {
  background: #fff4d9;
}
.cv_appPC_qr dt {
  margin-top: 10px;
  text-align: center;
  font-size: 16px;
}
.cv_appPC_qr img {
  background: #fff;
  padding: 5px;
}
.cv_appPC_newregister {
  margin-top: 40px;
  text-align: center;
}
.cv_appPC_newregister p {
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 1.75;
}
.cv_appPC_newregister a {
  font-weight: bold;
  font-size: 16px;
}

.cv_appSP {
  margin-bottom: 20px;
}
.cv_appSP_catch {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-bottom: 10px;
  padding: 20px 0 10px;
  color: #fa4141;
  text-align: center;
  line-height: 1.5;
  font-size: 16px;
  font-weight: bold;
  /* font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; */
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B";
}
.cv_appSP_catch::before,
.cv_appSP_catch::after {
  display: block; content: '';
  width: 2px; height: 3em;
  border-radius: 1px;
  background: currentColor;
}
.cv_appSP_catch::before {
  transform: rotate(-20deg);
}
.cv_appSP_catch::after {
  transform: rotate(20deg);
}
:root {
  --rbn-h: 40px;
  --rbn-w: 10px;
}
.cv_appSP_txtDl {
  display: table;
  position: relative;
  height: var(--rbn-h);/*リボンの高さ*/
  line-height: var(--rbn-h);/*リボンの高さ*/
  text-align: center;
  margin: 0 auto -30px;
  padding: 0 15px;/*横の大きさ*/
  border-radius: 20px;
  font-size: 16px;/*文字の大きさ*/
  font-weight: bold;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background: #fcd933;/*塗りつぶし色*/
  color: #92521d;/*文字色*/
  color: #f82402;
  box-sizing: border-box;
}
.cv_appSP_store {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 200px;
  margin: 10px auto 0;
  padding: 30px 40px;
  border-radius: 10px;
  background: #fff;
}
.cv_appSP_store.cv_appSP_store__beige {
  background: #fff4d9;
}
.cv_appSP_store p {
  margin-bottom: 5px;
  font-size: 14px;
}
.cv_appSP_store img {
  display: block;
}

/* ============================== footer */

.portal_footer { /*width: 980px;*/ text-align: center; margin: 0 auto;}
.portal_footer .reg_box_a { padding-bottom: 40px;}

.pf_btn { padding: 0 0 10px;}
.pf_btn p { font-size: 115%; padding: 3px 0;}
.pf_btn .btn_a {
  width: 460px; height: auto;
  border-width: 3px;
  line-height: 100%;
  padding: 12px 10px;
}
.pf_btn .btn_a img { height: 48px;}
.pf_btn .btn_a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}

.portal .sns_area { padding: 0 0 20px;}
.portal .sns_area .sns_box { display: inline-block; vertical-align: top; overflow: hidden; padding: 0;}
.portal .sns_area .twitter { width: 100px;}
.portal .sns_icon { display: none;}
.portal .sns_link {
  margin-left: 200px;
}
/* .sns_link_text {
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
  padding: 10px 30px;
  border: 1px solid #f8da8e;
  border-radius: 9999px;
  background-color: #ffffff;
  text-align: center;
  line-height: 1.5;
  color: #92521d;
}
.sns_link_text::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 20px 10px 0 10px;
  border-color: #f8da8e transparent transparent;
  translate: -50% 100%;
}
.sns_link_text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 17.8px 8.9px 0 8.9px;
  border-color: #ffffff transparent transparent;
  translate: -50% 100%;
} */


/* 
.sns_link_text {
  display: table;
  width: fit-content;
  margin: 0 auto 20px;
  padding: 5px 5px;
  border-bottom: 3px dashed #ffd100;
  background-color: #fff4d9;
  line-height: 1.75;
  color: #6c3a11;
  font-weight: bold;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

  position: relative;
}
.sns_link_text::before {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 50%;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  background-color: #fff4d9;
  rotate: 135deg;
  translate: -50%;
}
.sns_link_text::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 50%;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  border: 2px solid;
  border-color: #ffd100 #ffd100 transparent transparent;
  background-color: #fff4d9;
  rotate: 135deg;
  translate: -50%;
} */

.sns_link_text {
  display: table;
  width: fit-content;
  margin: 0 auto 20px;
  padding: 10px 20px;
  background-color: #ffc59d;
  border-radius: 10px;
  color: #4f3a29;
  font-weight: bold;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  position: relative;
}
.sns_link_text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 20px;
  height: 12px;
  transform: translateX(-50%);
  box-sizing: border-box;
  background-color: #ffc59d;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.portal .sns_link_list {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-bottom: 10px;
  text-align: center;
}
.portal .sns_link_list li {
  display: inline-block;
}
.portal .sns_link_list img {
  width: 40px;
}

.disclaimer {
  display: table;
  margin-inline: auto;
  margin-block: 20px 10px;
  font-size: 10px;
  text-align: left;
}
.disclaimer_article {
  padding-left: 200px;
}

.secure .sns_area,
.secure .sns_icon { display: none;}

.portal_footer .license_area { font-size: 86%; padding: 0 0 20px; overflow: hidden;}
.portal_footer .license_area p {
  display: inline-block;
  line-height: 1.2; vertical-align: middle;
  padding: 0 5px;
  *display: inline; *zoom: 1;
}
.portal_footer .license_area p span { display: inline-block; padding: 3px 0 0 8px; *display: inline; *zoom: 1;}
.portal_footer .license_area img { width: 38px; vertical-align: middle; float: left;}

.kumon_service { position: relative; background: #fff; overflow: hidden;}
.kumon_service h2 { background: #7dcdf4; color: #fff; font-weight: bold; text-align: left; padding: 5px 10px;}
.kumon_service .banner_area { width: 870px; height: 60px; margin: 20px auto; overflow: hidden;}
.kumon_service .banner_area li { float: left; padding: 0 15px;}
.kumon_service .banner_area img { width: 260px;}
.kumon_service .nav_pager li { position: absolute; top: 68px;}
.kumon_service .nav_pager .next { right: 30px;}
.kumon_service .nav_pager .prev { left: 30px;}
.kumon_service .nav_pager img { width: 26px;}

.footer_link { font-size: 86%; text-align: center; padding: 0 0 20px;}
.footer_link li { display: inline; border-left: 1px solid #333; padding: 0 10px;}
.footer_link li:first-child { border-left: none;}
.footer_link li a { color: #333; text-decoration: none;}
.footer_link li a:hover { color: #f60; text-decoration: underline;}

.footer_pagetop { display: none; position: fixed; bottom: 15px; right: 5px; z-index: 1;}
.footer_pagetop a {
  display: inline-block;
  width: 40px;
  height: 32px;
  background: #fff;
  background: linear-gradient(top, #fff, #f2f2f2);
  background: -ms-linear-gradient(top, #fff, #f2f2f2);
  background: -moz-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f2f2f2));
  color: #524637;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border: 1px solid #ccc;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding-top: 8px;
}
.footer_pagetop a:before {
  display: block;
  width: 11px;
  height: 10px;
  content: "";
  background: url(../img/arw4.png) no-repeat;
  background-size: auto 10px; -webkit-background-size: auto 10px;
  margin: 0 auto 2px;
}


#footer p { font-size: 72%; padding: 10px 0 0;}
#footer .f_kumon { float: left;}
#footer .f_kumon a { text-decoration: none;}
#footer .f_kumon p { display: inline-block; padding-left: 10px;}
#footer .f_mi-te { float: right;}

@media screen and (max-width: 767px) {
.portal_footer { width: auto; padding: 10px 0 0;}
.portal_footer .reg_box_a { padding-bottom: 0;}

.footer_link { padding: 20px 0 0;}

.pf_btn { padding: 0 0 5px;}
.pf_btn .pf_txt { font-size: 100%;}
.pf_btn .pf_txt span { display: block;}
.pf_btn .btn_a { width: 280px; border-width: 2px;}
.pf_btn .btn_a img { height: 32px;}

.portal .sns_area { display: none; padding: 10px 0 0;}
.portal .sns_icon { display: block; text-align: center; padding: 10px 0 0;}
.portal .sns_icon li { display: inline-block; padding: 0 20px;}
.portal .sns_icon img { width: 40px;}
.portal .sns_link {
  margin: 30px 0 0;
}

.disclaimer_article {
  padding-left: 0;
}

.portal_footer .license_area { font-size: 72%; padding: 10px 0 5px;}
.portal_footer .license_area p { display: block; padding: 5px 0;}
.portal_footer .license_area p:last-child { width: 200px; margin: 0 auto;}
.portal_footer .license_area p:last-child span { padding-top: 6px;}

.kumon_news,
.kumon_service { margin-top: 10px; padding-top: 0; padding-bottom: 20px;}
.kumon_news + .kumon_service { margin-top: 0;}
.kumon_service .kumon_news { padding-bottom: 10px;}

.kumon_news h2,
.kumon_service h2 { background: #7dcdf4; color: #fff; font-weight: bold; text-align: left; padding: 5px 10px;}
/*
.kumon_news ul {
  background: #fff;
  text-align: left;
  border: 1px solid #7dcdf4;
  border-radius: 6px; -webkit-border-radius: 6px;
  padding: 5px 10px 10px;
  margin: 10px 10px 0;
}
*/
.kumon_news ul { text-align: left; margin: 0 10px;}
.kumon_news li { border-bottom: 1px dotted #ccc; padding: 5px 0;}
.kumon_news li:last-child { border-bottom: none;}
.kumon_news span { display: block; font-size: 10px;}
.kumon_news a { display: block; color: #17a0e5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

.kumon_service .banner_area { width: 290px; margin: 10px auto;}
.kumon_service .banner_area img { width: 260px;}
.kumon_service .nav_pager li { position: absolute; top: 60px;}
.kumon_service .nav_pager img { width: 20px;}
.kumon_service .nav_pager .next { right: 5px;}
.kumon_service .nav_pager .prev { left: 5px;}
.kumon_service .banner_area_wrap_sp { position: relative;}
.banner_area_wrap_sp .nav_pager li { top: 20px;}

.footer_pagetop { display: block;}

#footer p { font-size: 86%;}
#footer .f_kumon { float: none;}
#footer .f_kumon p { display: block; padding-left: 0;}
#footer .f_mi-te { display: none;}
}

/* ============================== footer2 */

.portal_footer2 { position: relative; background-color: #fff; padding: 40px 0 20px;}
.portal_footer2 .inner { width: 1020px; margin: 0 auto; overflow: hidden;}
.mite_media {
  width: 280px;
  background-color: #f9f1b8;
  box-shadow: 1px 1px 1px #ccc;
  float: right;
  border-radius: 10px; -webkit-border-radius: 10px;
  padding: 20px;
  margin-top: 34px;
}
.mite_media h2 { color: #ff781e; font-size: 12px; font-weight: bold; text-align: center;}
.mite_media h2 img { vertical-align: bottom; padding-right: 8px;}
.mite_media .media_txt { text-align: center; padding: 15px 0 10px;}
.mite_media ul { padding-bottom: 10px;}
.mite_media li { padding: 10px 0 0;}

.portal_footer2 .kumon_service {
  /* width: 670px; */
  /* float: left; */
  background: none;
}
.portal_footer2 .kumon_service h2 {
  color: #333;
  font-size: 18px;
  font-family: "秀英丸ゴシック B", "Shuei MaruGo B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background: none;
  padding: 0 0 10px;
}
.portal_footer2 .banner_area_wrap {
  box-sizing: border-box; -webkit-box-sizing: border-box;
  position: relative;
  width: 100%;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px 44px;
  /*margin: 22px 0 0; やりとりひろばバナー削除 */
}
.portal_footer2 .banner_area { width: auto; margin: 0;}
.portal_footer2 .kumon_service .banner_area li { padding: 0 10px;}
.portal_footer2 .kumon_service .nav_pager li { top: 0;}
.portal_footer2 .kumon_service .nav_pager a { display: block; width: 24px; height: 80px; text-align: center; background-color: #f8cc3f;}
.portal_footer2 .kumon_service .nav_pager a:hover { background-color: #ffb011;}
.portal_footer2 .kumon_service .nav_pager img { width: 10px; margin-top: 32px;}
.portal_footer2 .kumon_service .nav_pager .next { right: 0;}
.portal_footer2 .kumon_service .nav_pager .prev { left: 0;}

.portal_footer2 .license_area { text-align: center; padding: 30px 0 0;}
.portal_footer2 .license_area br { display: none;}
.portal_footer2 .license_area img { width: 50px; vertical-align: middle; padding-right: 10px;}
.portal_footer2 .license_area span {
  display: inline-block;
  border-right: 1px solid #333;
  padding-right: 20px;
  margin-right: 20px;
}
.portal_footer2 .license_area .block { border: none; padding: 0; margin: 0;}

#footer2 { background-color: #7dcdf4;}
#footer2 .footer_link { background-color: #fff; font-size: inherit; padding-top: 20px;}
#footer2 .footer_link li { display: inline-block; border-color: #ccc;}

.footer_inner {
  display: grid;
  width: auto;
  padding: 0;
}
.footer_inner .f_logo {
  padding: 15px;
  background: #7dcdf4;
  text-align: center;
}
.footer_inner p {
  padding: 10px;
  background: #fff;
  vertical-align: middle;
  text-align: center;
}

  @media screen and (max-width: 767px) {
  .portal_footer2 { padding: 30px 10px 20px;}
  .portal_footer2 .inner { width: auto;}
  .mite_media { width: auto; float: none; padding: 15px 10px 10px; margin: 0 2px 0 0;}
  .mite_media h2 { text-align: center;}
  .mite_media h2 img {
    width: 170px;
    display: inline-block;
    padding: 0;
  }
  .mite_media .media_txt { padding: 10px 0 0;}
  .mite_media ul { width: 240px; margin: 0 auto;}
  .mite_media a { font-size: 18px; letter-spacing: 0.1em; padding: 10px;}
  .portal_footer2 .kumon_service { width: auto; float: none; margin: 0 0 10px;}
  .portal_footer2 .kumon_service h2 { font-size: 16px; text-align: center; padding-bottom: 5px;}
  .bk_service_bnr a {
    display: block;
    width: 300px;
    height: 100px;
    /*background: url(../img/banner/bnr_bk_sp.png) no-repeat;
    background-size: 300px auto; -webkit-background-size: 300px auto; view側で切替 */
    margin: 0 auto;
  }
  /*.bk_service_bnr img { display: none;} view側で切替 */
  .bk_service_bnr img { width: 100%;}
  .portal_footer2 .banner_area_wrap { width: 300px; padding: 10px 24px; margin: 10px auto 0;}
  .portal_footer2 .kumon_service .banner_area { height: 54px;}
  .portal_footer2 .kumon_service .banner_area li { padding: 0 8px;}
  .portal_footer2 .kumon_service .nav_pager a { height: 74px;}


  .portal_footer2 .license_area { padding-top: 10px;}
  .portal_footer2 .license_area br { display: inline;}
  .portal_footer2 .license_area span {
    display: inline-block;
    text-align: left;
    border: none;
    padding: 5px 0 0;
    margin: 0;
  }
  .portal_footer2 .license_area .block { display: block; padding: 10px 0 0;}
  .portal_footer2 .license_area img { display: inline-block; vertical-align: top;}

  #footer2 .footer_link { font-size: 12px; padding: 10px 0;}

  .footer_inner .f_logo {
    text-align-last: left;
  }
  .footer_inner p {
    text-align-last: left;
  }
  .footer_inner p span {
    display: none;
  }
}

/* ============================== popup */

.popup_screen {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(255, 255, 255, 0.8);
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ccffffff,EndColorStr=#ccffffff);
  z-index: 100;
}
.popup {
  position: fixed; top: 50%; left: 50%;
  width: 336px;
  background: #fff3d9;
  border: 2px solid #ff9b57;
  border-radius: 6px; -webkit-border-radius: 6px;
  margin-left: -170px;
  z-index: 110;
}
.popup_inner { position: relative; padding: 0 20px 20px;}
.popup_close { position: absolute; top: 5px; right: 5px;}
.popup_close a {
  display: block; width: 30px; height: 18px;
  background: #ccc;
  background: linear-gradient(top, #d8d8d8, #ccc);
  background: -ms-linear-gradient(top, #d8d8d8, #ccc);
  background: -moz-linear-gradient(top, #d8d8d8, #ccc);
  background: -webkit-linear-gradient(top, #d8d8d8, #ccc);
  background: -webkit-gradient(linear, left top, left bottom, from(#d8d8d8), to(#ccc));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#d8d8d8,EndColorStr=#cccccc);
  border-bottom: 2px solid #999;
  color: #666; text-align: center; text-shadow: 0 1px 0 #fff;
  border-radius: 4px; -webkit-border-radius: 4px;
  padding-top: 9px;
}
.popup_close a:hover, .popup_close a:active {
  background: #d8d8d8;
  background: linear-gradient(top, #ccc, #d8d8d8);
  background: -ms-linear-gradient(top, #ccc, #d8d8d8);
  background: -moz-linear-gradient(top, #ccc, #d8d8d8);
  background: -webkit-linear-gradient(top, #ccc, #d8d8d8);
  background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#d8d8d8));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#cccccc,EndColorStr=#d8d8d8);
}
.popup h2 {
  min-height: 20px;
  background: #fff;
  color: #92521d;
  font-size: 115%;
  border-bottom: 2px solid #ff9b57;
  border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0;
  padding: 8px 40px 8px 20px; margin: 0 -20px 20px;
}
.popup em { color: #f60;}

.popup_form { min-height: 70px;}
.popup.no_hl,
.popup_form.no_hl { padding-top: 45px;}
.popup_form .popup_txt { text-align: center; padding-bottom: 10px;}
.popup_form .popup_txt strong { display: block; font-size: 117%; font-weight: normal;}
.popup .form_btn a, .popup .form_btn input, .popup .form_btn button { width: auto; min-width: 150px; font-size: 100%; height: 36px;}
.popup .form_btn a { height: 30px;}
.popup .form_btn a { line-height: 30px;}

.popup .form_btn { width: auto;}
.popup .form_btn.half a { min-width: 130px;}
.popup .form_btn.half a.btn_g { min-width: 128px;}
.popup .form_btn.half input, .popup .form_btn.half button { min-width: 140px; padding: 0;}
.popup .form_btn.half input.btn_g, .popup .form_btn.half button.btn_g { min-width: 138px;}
.popup .form_btn.half a:first-child, .popup .form_btn.half input:first-child, .popup .form_btn.half button:first-child { margin-right: 15px;}

.popup_monthly .inner_link0 { padding-top: 10px;}
.popup_monthly .inner_link0 li { float: none;}
.popup_monthly .inner_link0 li a:hover { text-decoration: underline;}

.popup .hl_orange {
  color: #fff;
  font-weight: bold;
  background: #FF8839;
  border-radius: 12px;
  -webkit-border-radius: 12px;
  padding: 3px 12px;
  margin: 15px 0 5px;
}

.loading { position: fixed; height: 32px; width: 32px;}

/* ------------------  */

.bk_rec_popup .bk_ehon,
.bk_rec_popup .bk_uta { box-sizing: border-box; -webkit-box-sizing: border-box; width: 50%;}
.bk_rec_popup .bk_ehon { float: left; padding-right: 12px;}
.bk_rec_popup .bk_uta { float: right; padding-left: 10px; border-left: 2px dotted #ff9b57;}
.bk_rec_popup h3 { color: #92521d; font-weight: bold; text-align: center; padding-bottom: 5px;}

.family_viewer_alert_popup .popup_inner { padding: 0 20px 20px;}

@media screen and (max-width: 767px) {
.popup { width: 296px; border-radius: 4px; -webkit-border-radius: 4px; margin-left: -150px;}
.popup_inner { padding: 0 10px 15px;}
.popup_close { right: 5px;}
.popup h2 { font-size: 100%; padding: 10px 40px 10px 10px; margin: 0 -10px 15px;}

.popup .form_btn.half a { min-width: 123px;}
.popup .form_btn.half a.btn_g { min-width: 121px;}
.popup .form_btn.half input, .popup .form_btn.half button { min-width: 133px;}
.popup .form_btn.half a:first-child, .popup .form_btn.half input:first-child, .popup .form_btn.half button:first-child { margin-right: 10px;}

.popup_monthly .inner_link0 li a { text-decoration: none;}
.popup_monthly .inner_link0 li a:focus,
.popup_monthly .inner_link0 li a:active { text-decoration: underline;}

.family_viewer_alert_popup .popup_inner { padding: 0 10px 15px;}
.family_viewer_alert_popup.popup h2 { padding: 10px 40px 10px 10px; margin: 0 -10px 15px;}
}

/* ============================== demo area */

.demo_ttl { position: absolute; width: 200px; top: 25px; left: 50%; text-align: center; margin-left: -100px;}
/*
.demo .stamp_area li,
.demo .btn_edit a,
.demo .comment_wrap a,
.demo .outi_datebox a,
.demo .mytana_tab_box a,
.demo .date_box a,
.demo .tab_box a,
.demo .line_box.record_area a { cursor: default;}
*/
.demo .mypage_search .tab_box a { cursor: pointer;}

.demo .mytana_tab_box a { color: #f60; text-decoration: none;}

.demo .bk_date_area .date_box a:hover { color: #333;}

.demo .btn_edit a:hover img,
.demo .gallery_box a:hover,
.demo .comment_wrap a:hover img,
.demo .outi_datebox a:hover img,
.demo .mytana_tab_box a:hover img,
.demo .date_box a:hover img,
.demo .tab_box a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}
.demo .mypage_search .tab_box a:hover img { opacity: 0.8; filter: alpha(opacity=80); filter: -ms-alpha(opacity=80);}

.demo .edit_stamp_sort select:disabled,
.demo .kiriban_change_form select:disabled,
.demo .mytana_sort:disabled,
.demo .form_select select.line_style:disabled { color: #333; background-color: #fff;}

.demo .line_box.record_area a:hover { background-color: transparent;}

.demo .pc_uta_area .form_btn input,
.demo .pc_ehon_area .form_btn input,
.demo .bk_date_area .date_select .btn_b,
.demo .form_btn.messagebox button,
.demo .item_detail .btn_area a,
.demo .book_area .btn_area a { cursor: default;}
.demo .pc_uta_area .form_btn .btn_a:hover,
.demo .pc_uta_area .form_btn .btn_a:active,
.demo .pc_ehon_area .form_btn .btn_a:hover,
.demo .pc_ehon_area .form_btn .btn_a:active,
.demo .item_detail .btn_area a.btn_a:hover,
.demo .item_detail .btn_area a.btn_a:active,
.demo .book_area .btn_area a.btn_a:hover,
.demo .book_area .btn_area a.btn_a:active {
  background: #ff4646;
  background: linear-gradient(top, #ff6a6a, #ff4646);
  background: -ms-linear-gradient(top, #ff6a6a, #ff4646);
  background: -moz-linear-gradient(top, #ff6a6a, #ff4646);
  background: -webkit-linear-gradient(top, #ff4646, #ff4646);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff6a6a), to(#ff4646));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff6a6a,EndColorStr=#ff4646);
}
.demo .bk_date_area .date_select .btn_b:hover,
.demo .bk_date_area .date_select .btn_b:active,
.demo .form_btn.messagebox .btn_b:hover,
.demo .form_btn.messagebox .btn_b:active,
.demo .item_detail .btn_area a.btn_b:hover,
.demo .item_detail .btn_area a.btn_b:active,
.demo .book_area .btn_area a.btn_b:hover,
.demo .book_area .btn_area a.btn_b:active {
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
}

.demo .pc_uta_area .form_btn .btn_g:hover,
.demo .pc_uta_area .form_btn .btn_g:active,
.demo .pc_ehon_area .form_btn .btn_g:hover,
.demo .pc_ehon_area .form_btn .btn_g:active,
.demo .form_btn.messagebox .btn_g:hover,
.demo .form_btn.messagebox .btn_g:active {
  background: #f2f2f2;
  background: linear-gradient(top, #fff, #f2f2f2);
  background: -ms-linear-gradient(top, #fff, #f2f2f2);
  background: -moz-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-linear-gradient(top, #fff, #f2f2f2);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f2f2f2));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#f2f2f2);
}

.demo .btn_b.none { cursor: default;}
.demo .btn_b.none:hover {
  background: #ff802b;
  background: linear-gradient(top, #ff9d5b, #ff802b);
  background: -ms-linear-gradient(top, #ff9d5b, #ff802b);
  background: -moz-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-linear-gradient(top, #ff9d5b, #ff802b);
  background: -webkit-gradient(linear, left top, left bottom, from(#ff9d5b), to(#ff802b));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ff9d5b,EndColorStr=#ff802b);
}

.demo .mytana_search .form_search button,
.demo .mytana_search .form_search input[type="button"],
.demo .tab_box .form_search button,
.demo .tab_box .form_search input[type="button"] { cursor: default;}
.demo .mypage_search .form_search button,
.demo .mytana_search .form_search button:hover,
.demo .mytana_search .form_search button:active,
.demo .mytana_search .form_search input[type="button"]:hover,
.demo .mytana_search .form_search input[type="button"]:active,
.demo .tab_box .form_search button:hover,
.demo .tab_box .form_search button:active,
.demo .tab_box .form_search input[type="button"]:hover,
.demo .tab_box .form_search input[type="button"]:active {
  background: #ccc;
  background: linear-gradient(top, #f0f0f0, #ccc);
  background: -ms-linear-gradient(top, #f0f0f0, #ccc);
  background: -moz-linear-gradient(top, #f0f0f0, #ccc);
  background: -webkit-linear-gradient(top, #f0f0f0, #ccc);
  background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#ccc));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#f0f0f0,EndColorStr=#cccccc);
}

.demo .ms_inner2 .tab_box .form_search button,
.demo .ms_inner2 .tab_box .form_search input[type="button"] { cursor: pointer;}
.demo .ms_inner2 .tab_box .form_search button:hover,
.demo .ms_inner2 .tab_box .form_search button:active,
.demo .ms_inner2 .tab_box .form_search input[type="button"]:hover,
.demo .ms_inner2 .tab_box .form_search input[type="button"]:active {
  background: #f0f0f0;
  background: linear-gradient(top, #ccc, #f0f0f0);
  background: -ms-linear-gradient(top, #ccc, #f0f0f0);
  background: -moz-linear-gradient(top, #ccc, #f0f0f0);
  background: -webkit-linear-gradient(top, #ccc, #f0f0f0);
  background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#f0f0f0));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#cccccc,EndColorStr=#f0f0f0);
}

.demo .mypage_record .hide_pc img,
.demo .mypage_record .hide_sp img { margin-bottom: 10px;}

.demo .furikaeri_ranking_list a,
.demo .furikaeri_ranking_box a { cursor: default;}
.demo .furikaeri_ranking_list a:hover .rank_block span,
.demo .furikaeri_ranking_box a:hover .rank_block span { color: #333;}
.demo .furikaeri_ranking_list a:hover img,
.demo .furikaeri_ranking_box a:hover img { opacity: 1; filter: alpha(opacity=100); filter: -ms-alpha(opacity=100);}
.demo .edit_stamp,
.demo .stamp_box .btn_more a,
.demo .furikaeri_ranking_list + .btn_more a { cursor: default;}
.demo .edit_stamp:hover,
.demo .stamp_box .btn_more a:hover,
.demo .furikaeri_ranking_list + .btn_more a:hover { background-image: url(../../common/img/pc_arw1.png);}

.demo .datalist .line_box li a,
.demo .ranking_list li a { cursor: default;}
.demo .datalist .line_box li a:hover,
.demo .ranking_list li a:hover { background-color: #fff;}

.demo .date_area .popup_open { cursor: default;}
.demo .date_area .popup_open:hover {
  background: #fff;
  background: linear-gradient(top, #fff, #f0f0f0);
  background: -ms-linear-gradient(top, #fff, #f0f0f0);
  background: -moz-linear-gradient(top, #fff, #f0f0f0);
  background: -webkit-linear-gradient(top, #fff, #f0f0f0);
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f0f0f0));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#f0f0f0);
}

@media screen and (max-width: 767px) {
.demo_ttl { top: 26px; font-size: 10px; text-align: left; margin-left: -36px;}
.demo_ttl img { height: 12px; vertical-align: middle;}

.demo .edit_stamp,
.demo .edit_stamp:hover,
.demo .stamp_box .btn_more a,
.demo .stamp_box .btn_more a:hover,
.demo .furikaeri_ranking_list + .btn_more a,
.demo .furikaeri_ranking_list + .btn_more a:hover { background-color: #ffe3d0; background-image: url(../../common/img/btn_more2.png);}
}

iframe[name="google_conversion_frame"] { position: absolute; top: 0; left: 0; z-index: -1;}