/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Base Layout

/////////////////////////////////////////////////////////////////////////////////////////////////*/

html, body {
	width:100%;
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* Tap時の影を消す */
	-webkit-text-size-adjust:none;				/* 文字の大きさを自動で変化させない */
	font-family:'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	font-size:12px; line-height:1.4em; color:#525252;
}

a { color:inherit; text-decoration:none;}
img { display:block;}

.font_set { font-family:'Hiragino Kaku Gothic ProN', Meiryo, sans-serif; font-size:12px;}
.inner { max-width:970px; margin:0 auto; padding:0 2px;}
.left  { float:left;}
.right { float:right;}

.op_set {
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	opacity: 0.2;
}

.radius_box {
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.radius_t_box {
	-webkit-border-radius: 4px;
	-webkit-border-bottom-left-radius: 0px;
	-webkit-border-bottom-right-radius: 0px;
	-moz-border-radius: 4px;
	-moz-border-radius-bottomleft: 0px;
	-moz-border-radius-bottomright: 0px;
	border-radius: 4px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.radius_b_box {
	-webkit-border-radius: 4px;
	-webkit-border-top-left-radius: 0px;
	-webkit-border-top-right-radius: 0px;
	-moz-border-radius: 4px;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-topright: 0px;
	border-radius: 4px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}

.btn_01 {
	display:block; width:100%; height:45px;
	font-size:14px; color:#FFF; line-height:45px; text-align:center;
}
.btn_02 {
	display:block; width:140px; height:35px;
	font-size:13px; color:#524E41; line-height:35px; text-align:center;
}
.btn_03 {
	display:block; width:50%; height:35px;
	font-size:12px; color:#524E41; line-height:35px; text-align:center;
}

.bg_01 { background:#E65B6C; border:#DD484D 1px solid;}
.bg_02 { background:#BB745B; border:#B56A51 1px solid;}
.bg_03 { background:#F7F7F7; border:#EEEEEE 1px solid;}
.bg_04 { background:#FFF;}
.bg_05 { background:#A09E94;}

span.arrow01 {
	display:inline-block; width:13px; height:13px;
	background: url(../images/arrow01.png) no-repeat;
	background: url(../images/arrow01_ie.png) no-repeat\9;
	background-size:13px 13px;
	-webkit-background-size:13px 13px;
}

.close_btn {
	display:block; width:12px; height:12px; cursor:pointer;
	background: url(../images/close.png) no-repeat center center;
	background-size:12px 12px;
	-webkit-background-size:12px 12px;
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Header

/////////////////////////////////////////////////////////////////////////////////////////////////*/
#pgheader {
    position: relative;
    max-width: 970px;
    height: 50px;
    display: block;
    margin: auto;
}

#pgheader>div {
    position: absolute;
    display: block;
}

#pgheader .infologo {
    margin: 0 auto 0 0;
    top: 10px;
    left: 0;
    height: 26px;
}

#pgheader .menu {
    height: 30px;
    margin: 0 0 0 auto;
    top: 10px;
    right: 0;
    width: auto;
}
@media screen and (max-width: 740px) {
  #pgheader .menu #login_btn {
    display: none;
  }
}
#pgheader img {
    height: 100%;
}

#pgheader .menu>span {
    display: inline-block;
    margin-left: 10px;
    height: 100%;
}
#pgheader .menu #menu_btn .btn-menu-close {display: none;}
#pgheader .menu #menu_btn.openMenu .btn-menu-close {display: block;}
#pgheader .menu #menu_btn.openMenu .btn-menu-menu {display: none;}
/* search box */
#header_search{
    top: 10px;
    height: 30px;
    right: 150px;
}
#header_search .input_area {position: absolute;top: 0;height: 30px;right: 0;}
#header_search .input_area input[type="text"] {
  width:210px;
  height: 30px;
  line-height:26px;
  margin:0;
  padding:0 28px 0 0;
  text-indent:0.8em;
  vertical-align:middle;
  border: #DDD 1px solid;
  border-radius: 13px;
  -webkit-border-radius: 13px;
  -moz-border-radius: 13px;
  -webkit-appearance: none;
  -moz-appearance: none;
  resize: none;
}

/* search box bottun */
#header_search .input_area button {
  position:absolute;
  top:3px;
  right: 3px;
  cursor:pointer;
  border:none;
  background:none;
  margin:0;
  padding:0;
  -webkit-appearance: none;
  -moz-appearance: none;
}


/* menu */
.pgheader-menu {display: none;}

.pgheader-menu-inner {
    width: 970px;
    display: inline-block;
}

.pgheader-menu {
    width: 100%;
    position: absolute;
    z-index: 100;
    background: rgba(204, 204, 204, 0.75);
    text-align: center;
    top: 50px;
    font-size: 12px;
    border-bottom: 4px solid #e91e63;
}

.pgheader-menu a{color: #252525; font-weight: 400;}

.pgheader-menu-wrap {
    display: block;
    text-align: left;
    margin: 0 0 0 auto;
    width: 540px;
    padding: 10px 20px;
    background: #fff;
}

.pgheader-menu-topnavi-sec li {
    width: 230px;
    display: inline-block;
    padding: 10px;
    font-size: 1.2em;
    margin: 5px;
    vertical-align: top;
    position: relative;
    transition: all .2s linear;
    border-radius: 6px;
    text-align: center;
    background-color: #fdeded;
}
.pgheader-menu-topnavi-sec li:hover{background-color: #ee8a8b;}

@media screen and (min-width: 741px) {
  .pgheader-menu-login-sec {
    display: none;
  }
}
.pgheader-menu-login-sec {
    height: 30px;
    text-align: center;
    padding-right: 1.6%;
    margin: 10px 0;
}
.pgheader-menu-login-sec li {
    width: auto;
    height: 100%;
    display: inline-block;
    margin: 0 5px;
    vertical-align: top;
    position: relative;
    transition: all .2s linear;
}
.pgheader-menu-login-sec li * {
    height: 100%;
}
.pgheader-menu-sec li {
    width: 230px;
    display: inline-block;
    padding: 10px;
    font-size: 1.2em;
    border-bottom: 1px solid #ccc;
    margin: 0 5px;
    vertical-align: top;
    position: relative;
    transition: all .2s linear;
}

.pgheader-menu-sec li {
    width: 230px;
    display: inline-block;
    padding: 10px;
    font-size: 1.2em;
    border-bottom: 1px solid #ccc;
    margin: 0 5px;
    vertical-align: top;
    position: relative;
    transition: all .2s linear;
}
.pgheader-menu-sec li:hover {
    background-color: #fdeded;
}

.pgheader-menu-subttl {
    font-size: 1.2em;
    color: #E91E63;
    font-weight: normal;
    margin: 20px 5px 2px 0;
    padding-bottom: 4px;
    border-bottom: 1px solid #e91e63;
}

.pgheader-menu-sec.menu-pickup li {
    border: none;
    padding: 1px;
    margin: 2px 0;
}

.pgheader-menu-sec.menu-pickup li img {
    width: 100%;
}

.pgheader-menu-sec.menu-text li:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #ee8a8c;
  border-right: solid 2px #ee8a8c;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 5px;
  margin-top: -4px;
}
.pgheader-menu-btn-sec {
    margin: 10px 20px;
}

.pgheader-menu-btn-sec .menu-btn {
    display: inline-block;
    width: auto;
    padding: 6px 20px;
    margin: 0 0 0 auto;
    background-color: #ed8a8c;
    color: #fff;
    border-radius: 2px;
    display: block;
    width: 120px;
    text-align: center;
}
@media screen and (max-width: 740px) {
  #pgheader {
    width: 96%;
  }
  .pgheader-menu-inner {
    width: 100%;
    display: block;
  }
  .pgheader-menu-wrap {
    width: 100%;
    margin: 0;
  }
  .pgheader-menu-topnavi-sec li{width: 46%;}
  .pgheader-menu-sec li {width: 46%;}
  .pgheader-menu-sec.menu-pickup li img {
    width: 100%;
  }
  .pgheader-menu-sec.menu-pickup li {
    padding: 4px;
  }
  .pgheader-menu-btn-sec {
    margin: 10px;
  }
  #header_search .input_area {
    position: relative;
    width: 100%;
    margin-top: 40px;
  }
  #pgheader>div#header_search {
    position: relative;
    width: 100%;
    right: 0;
  }
  #header_search .input_area input[type="text"] {
    width: 100%;
  }
}
@media screen and (max-width: 360px) {
  .pgheader-menu-wrap {
    padding: 10px 2px;
    font-size: 0.9em;
  }
}
/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Contents

/////////////////////////////////////////////////////////////////////////////////////////////////*/

#contents { width:100%; height:auto; overflow:hidden; padding-bottom:4px;}


/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Footer

/////////////////////////////////////////////////////////////////////////////////////////////////*/

#footer { background-color:#F0EFEC; border-top:#E1DFD9 1px solid; padding:30px 0;}
#footer .inner { padding:0 4px; text-align:center;}

#footer img { display:inline-block; margin-top:20px;}
#footer .btn_02 { display:inline-block; margin:0 5px;}
#footer ul.page_link {text-align: center;}
#footer .page_link li {
	display:inline-block; padding-right:5px; margin-right:4px; border-right:#666 1px solid;
	color:#666; font-size:10px;
}
#footer .page_link li.last { padding-right:0; margin-right:0; border-right:none;}
#footer .page_link li a:hover { color:#FF8080; text-decoration:underline;}

#footer p.copy { font-size:10px; color:#888888; margin-top:20px; text-align:center;}



/*/////////////////////////////////////////////////////////////////////////////////////////////////

 media screen

/////////////////////////////////////////////////////////////////////////////////////////////////*/


@media screen and (max-width: 600px) {

	.inner { padding:0;}
	
}


@media screen and (max-width: 480px) {
	
	#contents { padding-bottom:1px;}
	
	#footer { border-top:none; padding:30px 0;}
	#footer .logo { display:none;}
}




/*/////////////////////////////////////////////////////////////////////////////////////////////////

 clerfix

/////////////////////////////////////////////////////////////////////////////////////////////////*/

.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
} /*IE7?O_uEU*/

.clearfix{display:inline-block;} /*IE7MacIE5*/

/*Hides from IE-mac\*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/*End hide from IE-mac*/ /*IE6?O*/
