﻿@charset "utf-8";

html{
	font-size: 62.5%;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){

}

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

body{
	font-family: '游ゴシック', YuGothic, 'Yu Gothic', 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif !important;
	font-size: 14px !important;
	font-size: 1.4rem !important;
	line-height: 1.5 !important;
}
@media screen and (min-width: 751px){
body{
	
}
}
@media screen and (max-width: 750px){
body{
	
}
}

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

#wrapper{
	
}
@media screen and (min-width: 751px){
#wrapper{
	
}
}
@media screen and (max-width: 750px){
#wrapper{
	
}
}

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

header{
	
}
header .wrap{
	background: #F7F7F7;
	border-bottom: 1px solid #CCC;
	box-shadow: 0 1px 3px rgba(0,0,0,.05);
	padding: 0 2em;
}
header h1 .logo{
	height: 30px;
	margin: 25px 0;
}
@media screen and (min-width: 751px){
header{
	
}
}
@media screen and (max-width: 750px){
header{
	position: relative;
}
header .wrap{
	padding: 0 15px;
}
header h1 .logo{
	max-width: 200px;
}
}

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

header .wrap .inner1000{
	position: relative;
}
.user{
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	position: absolute;
	top: 10px;
	right: 0;
	z-index: 1000;
}
.user .name{
	position: relative;
	padding: 20px 30px;
	font-size: 1.5rem;
	background: url("../img/mypage/ico_user_arrow.png") no-repeat 90% 45%;
	min-width: 115px;
	z-index: 1002;
	cursor: pointer;
	margin-right: 1em;
}
.user .function{
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	border: 1px solid #ccc;
	background: #fff;
	padding: 50px 30px 20px 20px;
	z-index: 1001;
	box-sizing: border-box;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
header .wrap{
	display: flex;
	align-items: center;
}
.user{
	position: static;
}
.user .name{
	font-size: 1.2rem;
	text-align: right;
	padding: 0 2em 0 0;
	background: url("../img/mypage/ico_user_arrow.png") no-repeat right 45%;
}
}

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

.user.active .function{
	display: block;
}
.user .function ul{
	margin: 15px 0;
}
.user .function li a{
	display: block;
	margin: 7px 0;
}
.user .function .user_id{
	font-size: 10px;
	font-size: 1rem;
	font-weight: normal;
	color: #999;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
.user.active .function{
	display: block;
	font-size: 1.2rem;
	max-width: 13em;
	right: 0;
	left: auto;
}
}

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

.menu_button{
	vertical-align: top;
}
.menu_button a,
.menu_button a .line{
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu_button a{
	width: 27px;
	height: 24px;
	position: relative;
	z-index: 1100;
}
.menu_button a .line{
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: #333;
	border-radius: 4px;
}
.menu_button a .line:nth-of-type(1){
	top:0;
}
.menu_button a .line:nth-of-type(2){
	top: 10px;
}
.menu_button a .line:nth-of-type(3){
	bottom: 0;
}
.menu_button.active a .line:nth-of-type(1){
	-webkit-transform: translateY(10px) rotate(-45deg);
	transform: translateY(10px) rotate(-45deg);
}
.menu_button.active a .line:nth-of-type(2){
	opacity: 0;
}
.menu_button.active a .line:nth-of-type(3){
	-webkit-transform: translateY(-10px) rotate(45deg);
	transform: translateY(-10px) rotate(45deg);
}
@media screen and (min-width: 751px){
	
}
@media screen and (max-width: 750px){
.menu_button{
	padding: 15px 20px;
	margin-top: 5px;
	position: absolute;
	top: 0;
	right: 0;
}
}

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

#main{
	
}
@media screen and (min-width: 751px){
#main{
	
}
}
@media screen and (max-width: 750px){
#main{
	
}
}

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

#contents{
	
}
#contents h2{
	font-size: 22px;
	font-size: 2.2rem;
	padding: 10px 0 30px 0;
}
@media screen and (min-width: 751px){
#contents{
	
}
}
@media screen and (max-width: 750px){
#contents{
	
}
#contents h2{
	font-size: 1.6rem;
}
}

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

#sidebar{
	
}
@media screen and (min-width: 751px){
#sidebar{
	
}
}
@media screen and (max-width: 750px){
#sidebar{
	
}
}

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

footer{
	background: #FAFAFA;
	padding: 40px 0;
}
@media screen and (min-width: 751px){
footer{
	
}
}
@media screen and (max-width: 750px){
footer{
	
}
}

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

.kriesi .pagination{
	text-align: center; 
}
.kriesi .pagination a,
.kriesi .pagination span{
	border: 1px solid #999;
	padding: 3px 4px;
	margin: 5px;
	font-size: 1.2rem;
}
.kriesi .pagination span{
	color: #999;
	border: 1px solid #DDD;
}
.kriesi .pagination a:hover{
	opacity: 0.6;
}

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

@media screen and (min-width: 751px){
.sp{
	display: none !important;
}
}
@media screen and (max-width: 750px){
.pc{
	display: none !important;
}
}
@media screen and (max-width: 750px){
img{
	width: 100%;
}
}
/* 装飾 */
.blue{
	color: #3CF !important;
}
.red{
	color: #F00 !important;
}
.green{
	color: #6C0 !important;
}
.ease1s *{
	-webkit-transition: all ease-in-out .1s;
    transition: all ease-in-out .1s;	
}
.ease2s *{
	-webkit-transition: all ease-in-out .2s;
    transition: all ease-in-out .2s;	
}
.ease3s *{
	-webkit-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;	
}
.ease4s *{
	-webkit-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;	
}
.ease5s *{
	-webkit-transition: all ease-in-out .5s;
    transition: all ease-in-out .5s;	
}
.tac{
	text-align: center !important;
}
.tar{
	text-align: right !important;
}
.tal{
	text-align: left !important;
}

/*　フォントサイズ　*/
.fs10{
	font-size: 10px !important;
	font-size: 1rem !important;
}
.fs11{
	font-size: 11px !important;
	font-size: 1.1rem !important;
}
.fs12{
	font-size: 12px !important;
	font-size: 1.2rem !important;
}
.fs13{
	font-size: 13px !important;
	font-size: 1.3rem !important;
}
.fs14{
	font-size: 14px !important;
	font-size: 1.4rem !important;
}
.fs15{
	font-size: 15px !important;
	font-size: 1.5rem !important;
}
.fs16{
	font-size: 16px !important;
	font-size: 1.6rem !important;
}
.fs17{
	font-size: 17px !important;
	font-size: 1.7rem !important;
}
.fs18{
	font-size: 18px !important;
	font-size: 1.8rem !important;
}
.fs19{
	font-size: 19px !important;
	font-size: 1.9rem !important;
}
.fs20{
	font-size: 20px !important;
	font-size: 2rem !important;
}
.fs21{
	font-size: 21px !important;
	font-size: 2.1rem !important;
}
.fs22{
	font-size: 22px !important;
	font-size: 2.2rem !important;
}
.fs23{
	font-size: 23px !important;
	font-size: 2.3rem !important;
}
.fs24{
	font-size: 24px !important;
	font-size: 2.4rem !important;
}
.fs25{
	font-size: 25px !important;
	font-size: 2.5rem !important;
}
.fss{
	font-size: 80% !important;
}

/* インナー */
@media screen and (min-width: 751px){
.inner880{
	width: 880px;
	margin: 0 auto;
}
.inner900{
	width: 900px;
	margin: 0 auto;
}
.inner920{
	width: 920px;
	margin: 0 auto;
}
.inner940{
	width: 940px;
	margin: 0 auto;
}
.inner950{
	width: 950px;
	margin: 0 auto;
}
.inner960{
	width: 960px;
	margin: 0 auto;
}
.inner980{
	width: 980px;
	margin: 0 auto;
}
.inner1000{
	width: 1000px;
	margin: 0 auto;
}
}

/* マージン */
.mt1{
	margin-top: 1px;
}
.mt2{
	margin-top: 2px;
}
.mt3{
	margin-top: 3px;
}
.mt4{
	margin-top: 4px;
}
.mt5{
	margin-top: 5px;
}
.mt10{
	margin-top: 10px;
}
.mt15{
	margin-top: 15px;
}
.mt20{
	margin-top: 20px;
}
.mt25{
	margin-top: 25px;
}
.mt30{
	margin-top: 30px;
}
.mt35{
	margin-top: 35px;
}
.mt40{
	margin-top: 40px;
}
.mt45{
	margin-top: 45px;
}
.mt50{
	margin-top: 50px;
}
.mt60{
	margin-top: 60px;
}
.mt70{
	margin-top: 70px;
}
.mt80{
	margin-top: 80x;
}
.mt90{
	margin-top: 90px;
}
.mt100{
	margin-top: 100px;
}


.mr1{
	margin-right: 1px;
}
.mr2{
	margin-right: 2px;
}
.mr3{
	margin-right: 3px;
}
.mr4{
	margin-right: 4px;
}
.mr5{
	margin-right: 5px;
}
.mr10{
	margin-right: 10px;
}
.mr15{
	margin-right: 15px;
}
.mr20{
	margin-right: 20px;
}
.mr25{
	margin-right: 25px;
}
.mr30{
	margin-right: 30px;
}
.mr35{
	margin-right: 35px;
}
.mr40{
	margin-right: 40px;
}
.mr45{
	margin-right: 45px;
}
.mr50{
	margin-right: 50px;
}
.mr60{
	margin-right: 60px;
}
.mr70{
	margin-right: 70px;
}
.mr80{
	margin-right: 80x;
}
.mr90{
	margin-right: 90px;
}
.mr100{
	margin-right: 100px;
}


.mb1{
	margin-bottom: 1px;
}
.mb2{
	margin-bottom: 2px;
}
.mb3{
	margin-bottom: 3px;
}
.mb4{
	margin-bottom: 4px;
}
.mb5{
	margin-bottom: 5px;
}
.mb10{
	margin-bottom: 10px;
}
.mb15{
	margin-bottom: 15px;
}
.mb20{
	margin-bottom: 20px;
}
.mb25{
	margin-bottom: 25px;
}
.mb30{
	margin-bottom: 30px;
}
.mb35{
	margin-bottom: 35px;
}
.mb40{
	margin-bottom: 40px;
}
.mb45{
	margin-bottom: 45px;
}
.mb50{
	margin-bottom: 50px;
}
.mb60{
	margin-bottom: 60px;
}
.mb70{
	margin-bottom: 70px;
}
.mb80{
	margin-bottom: 80x;
}
.mb90{
	margin-bottom: 90px;
}
.mb100{
	margin-bottom: 100px;
}


.ml1{
	margin-left: 1px;
}
.ml2{
	margin-left: 2px;
}
.ml3{
	margin-left: 3px;
}
.ml4{
	margin-left: 4px;
}
.ml5{
	margin-left: 5px;
}
.ml10{
	margin-left: 10px;
}
.ml15{
	margin-left: 15px;
}
.ml20{
	margin-left: 20px;
}
.ml25{
	margin-left: 25px;
}
.ml30{
	margin-left: 30px;
}
.ml35{
	margin-left: 35px;
}
.ml40{
	margin-left: 40px;
}
.ml45{
	margin-left: 45px;
}
.ml50{
	margin-left: 50px;
}
.ml60{
	margin-left: 60px;
}
.ml70{
	margin-left: 70px;
}
.ml80{
	margin-left: 80x;
}
.ml90{
	margin-left: 90px;
}
.ml100{
	margin-left: 100px;
}

/* パディング */
.pt1{
	padding-top: 1px;
}
.pt2{
	padding-top: 2px;
}
.pt3{
	padding-top: 3px;
}
.pt4{
	padding-top: 4px;
}
.pt5{
	padding-top: 5px;
}
.pt10{
	padding-top: 10px;
}
.pt15{
	padding-top: 15px;
}
.pt20{
	padding-top: 20px;
}
.pt25{
	padding-top: 25px;
}
.pt30{
	padding-top: 30px;
}
.pt35{
	padding-top: 35px;
}
.pt40{
	padding-top: 40px;
}
.pt45{
	padding-top: 45px;
}
.pt50{
	padding-top: 50px;
}
.pt60{
	padding-top: 60px;
}
.pt70{
	padding-top: 70px;
}
.pt80{
	padding-top: 80x;
}
.pt90{
	padding-top: 90px;
}
.pt100{
	padding-top: 100px;
}


.pr1{
	padding-right: 1px;
}
.pr2{
	padding-right: 2px;
}
.pr3{
	padding-right: 3px;
}
.pr4{
	padding-right: 4px;
}
.pr5{
	padding-right: 5px;
}
.pr10{
	padding-right: 10px;
}
.pr15{
	padding-right: 15px;
}
.pr20{
	padding-right: 20px;
}
.pr25{
	padding-right: 25px;
}
.pr30{
	padding-right: 30px;
}
.pr35{
	padding-right: 35px;
}
.pr40{
	padding-right: 40px;
}
.pr45{
	padding-right: 45px;
}
.pr50{
	padding-right: 50px;
}
.pr60{
	padding-right: 60px;
}
.pr70{
	padding-right: 70px;
}
.pr80{
	padding-right: 80x;
}
.pr90{
	padding-right: 90px;
}
.pr100{
	padding-right: 100px;
}


.pb1{
	padding-bottom: 1px;
}
.pb2{
	padding-bottom: 2px;
}
.pb3{
	padding-bottom: 3px;
}
.pb4{
	padding-bottom: 4px;
}
.pb5{
	padding-bottom: 5px;
}
.pb10{
	padding-bottom: 10px;
}
.pb15{
	padding-bottom: 15px;
}
.pb20{
	padding-bottom: 20px;
}
.pb25{
	padding-bottom: 25px;
}
.pb30{
	padding-bottom: 30px;
}
.pb35{
	padding-bottom: 35px;
}
.pb40{
	padding-bottom: 40px;
}
.pb45{
	padding-bottom: 45px;
}
.pb50{
	padding-bottom: 50px;
}
.pb60{
	padding-bottom: 60px;
}
.pb70{
	padding-bottom: 70px;
}
.pb80{
	padding-bottom: 80x;
}
.pb90{
	padding-bottom: 90px;
}
.pb100{
	padding-bottom: 100px;
}


.pl1{
	padding-left: 1px;
}
.pl2{
	padding-left: 2px;
}
.pl3{
	padding-left: 3px;
}
.pl4{
	padding-left: 4px;
}
.pl5{
	padding-left: 5px;
}
.pl10{
	padding-left: 10px;
}
.pl15{
	padding-left: 15px;
}
.pl20{
	padding-left: 20px;
}
.pl25{
	padding-left: 25px;
}
.pl30{
	padding-left: 30px;
}
.pl35{
	padding-left: 35px;
}
.pl40{
	padding-left: 40px;
}
.pl45{
	padding-left: 45px;
}
.pl50{
	padding-left: 50px;
}
.pl60{
	padding-left: 60px;
}
.pl70{
	padding-left: 70px;
}
.pl80{
	padding-left: 80x;
}
.pl90{
	padding-left: 90px;
}
.pl100{
	padding-left: 100px;
}

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


@media screen and (min-width: 751px){
ul.vlist li{
	display: inline-block;
	box-sizing: border-box;
}
ul.vlist.c2 li{
	width: 50%;
}
ul.vlist.c3 li{
	width: 33.3%;
}
ul.vlist.c4 li{
	width: 25%;
}
ul.vlist.c5 li{
	width: 20%;
}
}
@media screen and (max-width: 750px){

}

header.fixed .hwrap{
	background: #fff;
	position: fixed;
	z-index: 1000;
	width: 100%;
}
.anchor{
	margin-top: -120px;
	padding-top: 120px;
}