﻿/* ---- regist --------------------------------*/
p{
	margin:0;
	padding:0;
}
ul{
	list-style:none;
}

.regist_box{
	padding:0;
	margin:30px auto;
}
.regist_box h3.regist_category{
	background-color: #29d5e2!important;
	color: #fff!important;
	padding: 10px 2.5%!important;
	font-size: 1.7rem!important;
	margin: 20px auto 10px auto!important;
	position:relative;
	text-shadow: 0 0 0;
	font-weight:bold;
	display:none;
}
.regist_box h3.regist_category:after{
	content:'▼';
	position:absolute;
	right:2.5%;
}
.regist_box h4.regist_point{
	font-size:1.4rem;
	color:#333;
	width:95%;
	margin:0 auto;
	letter-spacing: 0.12rem;
}
.regist_box h4.regist_point span.line{
	background:rgba(0, 0, 0, 0) linear-gradient(transparent 50%, #fffbaf 0%) repeat scroll 0 0;
}

.regist_box li.regist_box_list span.point{
	margin-left:10px;
	background-color:#ffb4a1;
	padding:5px 10px;
	color:#fff;
	text-shadow: 0 0 0;
	font-size:1.2rem;
	letter-spacing: 0.1rem;
}
.regist_box li.regist_box_list:nth-child(1) span.point{
	background-color:#ffb4a1;
}
.regist_box li.regist_box_list:nth-child(2) span.point{
	background-color:#ffa577;
}
.regist_box li.regist_box_list:nth-child(3) span.point{
	background-color:#ff8177;
}
.regist_box li.regist_box_list:nth-child(4) span.point{
	background-color:#ff6377;
}
.regist_box li.regist_box_list:nth-child(5){
	padding-bottom:20px;
}
.regist_box .regist_img{
	width:95%;
	margin:20px auto;
}
.regist_box .regist_img img{
	/*width:24%;
	margin:0.5%;*/
	width: 30%;
	margin: 1.6666666%;
	float: left;
	height: auto;
}
.regist_box .regist_img.point1200 img,.regist_box .regist_img.point2400 img{
	width: 30%;
	margin: 1.6666666%;
	float: left;
	height: auto;
}
.regist_box .regist_img.point1200 img,.regist_box .regist_img.point2400 img{
	width: 30%;
	margin: 1.6666666%;
	float: left;
	height: auto;
}
.regist_box li.regist_box_list:nth-child(5) .regist_img {
	text-align:center;
}
.regist_box li.regist_box_list:nth-child(5) .regist_img img{
	width:80%;
	margin:0 auto;
	float:inherit;
}
.regist_box li.regist_box_list .regist_img .login_paybtn img{
	width:100%;
}
.regist_box sup{
	font-size: 1.1rem;
	text-align: left;
	line-height: 1.8rem;
	display: block;
	margin-top: 15px;
	color:#aaa;
}
.regist_box .regist_img_list{
	display:block;
	margin:10px;
}
p.regist_what{
	margin:-15px auto 0 auto;
	padding:0 2.5%;
	text-align:right;
	font-size:0.8rem;
	letter-spacing: 0rem !important;
	line-height: 1.6rem !important;
}
p.regist_what a{
	color:#aaa;
	letter-spacing: 0rem !important;
	line-height: 1.5rem !important;
}
p.otameshi_point{
	color: #FA9573;
	text-align: center;
	border: 1px solid #FA9573;
	width: 95%!important;
	margin: 0 auto;
	font-weight: bold;
	padding: 5px!important;
	margin-bottom: 10px;
	font-size:1.4rem!important;
}
p.otameshi_point_position{
	text-align:right!important;
	padding:5px 0!important;
	margin-bottom: -15px!important;
}






.top_naka{
	max-width:768px;
	margin:0 auto;
	background-color:#fff;
	line-height:1.6em;
}
.top_naka img{
	max-width:100%;
	height:auto;
}


/* 2018ary
-----------------------------------------------------------------------------------------------------------*/


*{
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html{
	font-size: 62.5%;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}
html,body,div,dl,dt,dd,ul,ol,li,code,form,fieldset,input,textarea,p,blockquote,th,td,h1,h2,h3,h4,h5,h6,a{
	border:0;
	margin:0;
	padding:0;
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro","游ゴシック", YuGothic, "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-weight:normal;
	-webkit-text-size-adjust:none;
}

body {
	font-size: 1.6rem;
	-webkit-text-size-adjust: 100%;
}

ul{
	list-style-type: none;
}
a{
	cursor:pointer;
	transition: all 0.3s;
	color:#d3bb7a;
	font-weight:600;
	text-decoration: underline;
}
a:hover{
	opacity: 0.8;
}

a.btn{
	color: #4a4a4a;
	font-family: 'Playfair Display', serif;
	text-align:center;
	text-decoration: none;
	display: block;
	margin: 30px auto 50px auto;
	font-size: 1.8rem;
	line-height: 55px;
	height: 55px;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	border: solid 1px #4a4a4a;
	width: 250px;
	position: relative;
}

a.btn:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	display: inline-block;
	position: absolute;
	right: 10px;
	top: auto;
	bottom: auto;
	font-size: 1.4rem;
}

body{background-color:#ffffff;}

img{
	max-width:100%;
	height:auto;
}
.cf:after {
	content: "";
	clear: both;
	display: block;
}
.pc	{ display:inline!important; }
.mb	{ display:none!important; }
@media screen and (max-width: 768px) {
.pc	{ display:none!important; }
.mb { display:inline!important; }
}

#wrap{
	max-width:768px;
	height:auto;
	margin:0 auto;
	padding-top: 70px;
	background-color:#fff;
	overflow:hidden;
}

#contents{
	width:100%;
	position: relative;
}

sup{
	font-size: 1.2rem;
	line-height: 1.5rem;
	display: block;
	margin: 15px auto;
	color:#888;
}

.h2Wrap {
	margin: 0 auto 20px auto;
	text-align: center;
}

h2 {
	font-size: 2rem;
	line-height: 2rem;
	font-family: 'Noto Serif JP', serif;
	text-align: center;
	padding: 7px 20px 0 0;
	position: relative;
	display: inline-block;
}

h2:after {
	content: "";
	background: url("/image/site/h3TitleIcn.png") no-repeat;
	background-size: 22px auto;
	display: block;
	position: absolute;
	right: -5px;
	top: -7px;
	width: 22px;
	height: 26px;
}

h2 span {
	font-family: 'Playfair Display', serif;
	font-size: 1.4rem;
	line-height: 1.4rem;
	padding: 8px 0 0 0;
	display: block;
}

h3 {
	font-weight: bold;
	font-size: 1.8rem;
	margin: 0 10px 20px 10px;
}

/* ---- header-new --------------------------------*/
.login_header {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
	max-width: 768px;
	height: 50px;
	padding: 0 10px;
}

.login_header h1 img {
	max-width: 176px;
	height: auto;
}

.headerLogin a {
	font-family: 'Playfair Display', serif;
	display: block;
	text-decoration: none;
	color: #4a4a4a;
	font-size: 1.4rem;
	border: solid 1px #dbdbdb;
	text-align: center;
	padding: 5px 10px;
}

.headerLogin a i {
	color: #6a6a6a;
	display: inline-block;
	padding: 0 3px 0 0;
	font-size: 1.2rem;
}

.div_header{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
	height: 70px;
	max-width: 768px;
	padding: 0 10px;
    position: fixed;
    top: 0;
    margin: 0 auto;
    z-index: 9999;
	background: rgba(255, 255, 255, 0.95);
}
.div_header h1 {
	width: 50%;
}

.div_header h1 img {
	max-width: 100%;
}
#btn_setting,#btn_home{
	position: absolute;
    top:0;
	left:0;
	padding:5px;
	width:15%;
	height:100%;
}
.div_header #btn_fav i {
	font-size: 2.4rem;
}
#btn_setting img,#btn_home img,#btn_fav img,#btn_regist img{
	width:auto;
	height:100%;
}

@media screen and (min-width: 768px) {
	#btn_setting img,#btn_fav img,#btn_regist img,#btn_home img{
		width:auto;
		height:auto;
	}
}

/* nav */
* {
  outline: none;
}

#nav-container {

  pointer-events: none;
}

#nav-container * {
  visibility: visible;
}

.button {
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  border-radius: 0;
  width: 25px;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.icon-bar {
  display: block;
  width: 100%;
  height: 1px;
  background: #4a4a4a;
  transition: .3s;
}
.icon-bar + .icon-bar {
  margin-top: 5px;
}

#nav-container:focus-within .button {
  pointer-events: none;
}
#nav-container:focus-within .icon-bar:nth-of-type(1) {
  transform: translate3d(0,6px,0) rotate(45deg);
}
#nav-container:focus-within .icon-bar:nth-of-type(2) {
  opacity: 0;
}
#nav-container:focus-within .icon-bar:nth-of-type(3) {
  transform: translate3d(0,-6px,0) rotate(-45deg);
}

#nav-content {
  margin-top: 50px;
  width: 90%;
  max-width: 300px;
  position: absolute;
  top: 0;
  left: 0;
  height: calc(100% - 50px);
  background: rgba(255, 255, 255, 0.98);
  pointer-events: auto;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  transform: translateX(-100%);
  transition: transform .1s;
  will-change: transform;
  contain: paint;
  height: 100vh;
  opacity: 0;
  visibility: hidden;
  overflow: auto;
}

#nav-content ul {
  height: 100%;
  display: flex;
  flex-direction: column;
}

#nav-content ul li {
	border-bottom: solid 1px #dddddd;
	padding: 10px 10px;
}

#nav-content li a {
  display: block;
  text-transform: uppercase;
  transition: color .1s;
  color: #4a4a4a;
  position: relative;
  pointer-events: none;
}

#nav-content .navAccbox label { pointer-events: none; }

#nav-container:focus-within #nav-content .navAccbox label { pointer-events: auto; }

#nav-content li a i {
	position: absolute;
	right: 0;
	top: 50%;
	transform:translate(-50%,-50%);
	display: inline-block;
	font-size: 1.4rem;
}

#nav-container:focus-within #nav-content {
  transform: none;
  opacity: 1;
  visibility: visible;
}

#nav-container:focus-within #nav-content a { pointer-events: auto; }

#nav-container:focus-within .contents {
	overflow: hidden;
}


/* nav toggle */
.navAcc {
}

.navAcc .accIn {
    display: block;
	position: relative;
}

/*ラベル*/
.navAcc label {
    display: block;
    cursor :pointer;
    transition: all 0.5s;
}

/*アイコンを表示*/
.navAcc .accIn:after {
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f078";
	display: inline-block;
	position: absolute;
	right: 0;
	top: 50%;
	transform:translate(-50%,-50%);
	font-size: 1.4rem;
}

/*ラベルホバー時*/
.navAccbox label:hover {
    -webkit-tap-highlight-color: none;
}

/*チェックは隠す*/
.navAccbox input {
    display: none;
}

.navAccbox .navAccshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.3s;
}

 #nav-content .navAcc .navAccshow ul li {
	border: none;
	padding: 0 0 10px 10px;
}

 #nav-content .navAcc .navAccshow ul li a {
	 font-size: 1.4rem;
 }

.navAcc .cssacc:checked + label + .navAccshow {
    height: auto;
    padding: 20px 0 0 0;
    opacity: 1;
    line-height: 2.6rem;
}

.navAccbox .navAccshow p { margin: 15px 10px }

/*アイコンを入れ替える*/
.navAcc .cssacc:checked + label .accIn:after {
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f077";
	display: inline-block;
	position: absolute;
	right: 0;
	top: 50%;
	transform:translate(-50%,-50%);
	font-size: 1.4rem;
}

.faqImg {
    text-align: center;
    margin: 0 0 10px 0;
}

.faqImg img {
    max-width: 100%;
    height: auto;
}

.navAccbox div font {
    line-height: 2.2rem;
}




.dieterProfS {
	margin: 0 0 10px 10px;
}
.dieterProfS img {
	width: 56px;
	height: auto;
	margin: 0 10px 0 0;
}

@media screen and (max-width: 480px) {
.dieterProfS img { width: 28px; }
}

.dieterProfS a {
	font-size: 1.2rem;
	line-height: 1.6rem;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	color: #4a4a4a;
}

@media screen and (max-width: 480px) {
	.dieterProfS a {
		font-size: 1rem;
		line-height: 1.4rem;
	}
}



.catContent {
    display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
    margin: 0 0 50px 0;
}



@media screen and (max-width: 480px) {
	.catContent a:nth-child(1),
	.catContent a:nth-child(4),
	.catContent a:nth-child(7) {
		width: 100%;
	}

	.catContent a:nth-child(2),
	.catContent a:nth-child(3),
	.catContent a:nth-child(5),
	.catContent a:nth-child(6) {
	    width: 50%;
	}
}

.catBox {
    position: relative;
	line-height: 0;
}

.catBox dt {
    position: relative;
}

.catBox dt:before {
    content: "";
    position: absolute;
    display: block;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(153,153,153,0.5) 20%, rgba(255,255,255,0) 100%);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.catBox dd {
    font-size: 1.4rem;
    line-height: 2.2rem;
    font-weight: bold;
    position: absolute;
    z-index: 2;
    bottom: 20px;
    left: 10px;
    color: #ffffff;
}

@media screen and (min-width: 481px) {
    .catBox dd {
        font-size: 2.4rem;
        line-height: 3.6rem;
    }
}

.catBox dd span {
    font-size: 2rem;
    line-height: 2.8rem;
    letter-spacing: -1px;
}

@media screen and (min-width: 481px) {
    .catBox dd span {
        font-size: 4rem;
        line-height: 5.8rem;
    }
}


.recommendSwiper { margin: 0 10px 50px 10px !important; }

@media screen and (max-width: 480px) {
	.recommendSwiper { margin: 0 0 50px 10px !important; }
}

.recommendSwiper .swiper-wrapper { height: auto; }

@media screen and (max-width: 480px) {
	.recommendSwiper .swiper-wrapper { height: auto; }
}

.recommendSwiper .swiper-slide {
    width: 80%;
}

.recommendSwiper .swiper-slide:last-child { margin: 0 10px 0 0; }

.recommendSwiper .swiper-pagination {
    position: static;
    margin: 10px 0 0 0;
    line-height: 0;
}

.recommendSwiper .swiper-pagination-bullet-active { background: #d3bb7a !important; }






/* 作品3列表示 */
.titleList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 1% 30px 1%;
}

.titleList:after {
	content:"";
	display:block;
	width: 33.3%;
	height:0;
}

.titleList li {
	width: 33.3%;
	margin: 0;
	padding: 0 1px 1px 0;
	line-height: 0;
	font-size: 0;
	box-sizing: border-box;
	position: relative;
}

.titleList li:nth-child(3n) { padding: 0 0 1px 0; }











/* ---- footer --------------------------------*/
footer{
	position:fixed;
	max-width:768px;
	width:100%;
	bottom:0;
	z-index:100 ;
	line-height:100%;
	left: 50%!important;
	transform: translate(-50%)!important;
	-ms-transform: translate(-50%);
	-webkit-transform: translate(-50%);
	-moz-transform: translate(-50%);
	background-color:rgba(255,255,255,1);
	border-top:1px solid #eee;
}
footer ul{
	width:90%;
	margin:0 auto;
}
footer ul li{
	width:18%;
	margin: 5px 3.5%;
	float:left;
	text-align:center;
	line-height:100%;
}
footer ul li img{
	width:auto;
	height:auto;
	max-height:55px;
}
footer ul li a{
	display:inline-block;
	line-height:100%;
}
footer ul li a:hover{
	opacity: 0.8;
}

/* ---- ad --------------------------------*/
.ad_waku{
	margin:20px auto;
	text-align:center;
}

/* ---- フッターリンクinfomation --------------------------------*/
.top_menu {
	margin: 0 auto;
	padding: 0;
	border-top: 1px solid #ccc;
	background-color: #fff;
}
.top_menu .ttl {
	padding: .5em 1.143em;
	font-size: 14px;
	font-weight: 700;
	cursor: default;
	background-color: #f7f4f4;
	text-align: left;
}
.top_menu li {
	border: 0;
	border-bottom: 1px solid #ccc;
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.top_menu li a {
	margin: 0;
	display: block;
	position: relative;
	text-align: left;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font-size: 1.4rem;
	font-weight: normal;
	color: #666 !important;
	padding: .7em 1em;
	text-decoration: none;
}

.top_menu li a:after {
	background-position: center;
	background-image: url(/image/site/x_arrow_right.png);
	background-repeat: no-repeat;
	top: 50%;
	margin-top: -11px;
	right: .5625em;
	content: "";
	position: absolute;
	display: block;
	width: 22px;
	height: 22px;
}


/* ---- pankuzu --------------------------------*/
ul.pank {
	margin:0 auto;
	width:100%;
	padding: 10px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	margin: 0 0 20px 0;
}

ul.pank li {
  	display:inline;
  	list-style: none;
	font-size: 1.2rem;
	line-height: 1.2rem;
}

ul.pank li:after{
  	content: '>';
  	padding: 0 2px 0 8px;
	color: #4a4a4a;
}
ul.pank li:last-child:after{
	content: '';
}

@media screen and (min-width: 768px) {
	ul.pank{
		padding:4px 2.5%;
	}
	ul.pank li,ul.pank li a{
		font-size:1.4rem;
	}
}


/* ---- favorite --------------------------------*/

/*roop_contents*/
.box2{
	width : 50%;
	width : -webkit-calc(100% / 2);
	width : calc(100% / 2);
}
.box3{
	width : 33.33333%;
	width : -webkit-calc(100% / 3);
	width : calc(100% / 3);
}
.box4{
	width : 25%;
	width : -webkit-calc(100% / 4);
	width : calc(100% / 4);
}
.float{
	float:left;
}

/*list*/
ul.fav_list{
	width:96%;
	margin:0 auto;
}
ul.fav_list li{
	padding:1%;
	position:relative;
}

li .btn_off {
	position:absolute;
	bottom: 5px;
	right: 5px;
	width:50px;
	height:50px;
	transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    font-size: 2.8rem;
	background: #ffffff;
	border: solid 1px #d3bb7a;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	color: #d3bb7a;
	text-align: center;
	line-height: 50px;
	vertical-align: middle;
}
li .btn_on{
	position:absolute;
	bottom: 5px;
	right: 5px;
	width:50px;
	height:50px;
	transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
	font-size: 2.8rem;
	background: #d3bb7a;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	color: #ffffff;
	text-align: center;
	line-height: 50px;
	vertical-align: middle;
}
ul.fav_list li .btn_on:active,ul.fav_list li .btn_off:active{
	transform: scale(1.6);
    -webkit-transform: scale(1.6);
    -moz-transform: scale(1.6);
    -o-transform: scale(1.6);
    -ms-transform: scale(1.6);
}
@media screen and (max-width: 480px) {
	li .btn_off,
	li .btn_on {
		width: 35px;
		height: 35px;
		line-height: 35px;
		border-radius: 35px;
		font-size: 2rem;
	}

}


/* ---- ranking --------------------------------*/

/*list*/
ul.rank_list { margin: 0 auto 30px auto; }

ul.rank_list li {
	position:relative;
	border-bottom: solid 1px #dddddd;
	padding: 20px 10px;
}

.rank_list li:first-child { border-top: solid 1px #dddddd; }

.rank_list .rankInside {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.rankRibbon {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 5px;
  margin: 0;
  padding: 5px 0;
  z-index: 2;
  width: 30px;
  text-align: center;
  font-size: 1.8rem;
  font-family: arial;
  color: white;
}

.rank_list li:nth-child(1) .rankRibbon { background: #d0bc86; }
.rank_list li:nth-child(2) .rankRibbon { background: #b9b9b9; }
.rank_list li:nth-child(3) .rankRibbon { background: #ce9f7c; }
.rank_list li:nth-child(n+4) .rankRibbon { background: #4a4a4a; }

.rankRibbon:after {
  content: '';
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-bottom: 10px solid transparent;
}

.rank_list li:nth-child(1) .rankRibbon:after {
	border-left: 15px solid #d0bc86;
    border-right: 15px solid #d0bc86;
}

.rank_list li:nth-child(2) .rankRibbon:after {
	border-left: 15px solid #b9b9b9;
    border-right: 15px solid #b9b9b9;
}

.rank_list li:nth-child(3) .rankRibbon:after {
	border-left: 15px solid #ce9f7c;
    border-right: 15px solid #ce9f7c;
}

.rank_list li:nth-child(n+4) .rankRibbon:after {
	border-left: 15px solid #4a4a4a;
    border-right: 15px solid #4a4a4a;
}


.rank_list .rankImg {
	margin: 0 20px 0 0;
	width: 30%;
}

.rank_list li a { color: #4a4a4a; }

.rankCat {
	display: inline-block;
	font-size: 1.4rem;
	line-height: 1.4rem;
	border-bottom: solid 1px #7b7b7b;
	padding: 0 0 8px 0;
	margin: 0 0 10px 0;
}

.rank_list li .rankCat a { color: #7b7b7b; }

@media screen and (max-width: 480px) {
	.rankCat {
		font-size: 1.2rem;
		line-height: 1.2rem;
}
}

.rankTitle {
	font-size: 1.8rem;
	line-height: 2.6rem;
	font-weight: bold;
}

@media screen and (max-width: 480px) {
	.rankTitle {
		font-size: 1.6rem;
		line-height: 2.4rem;
	}
}

.rankDieter {
	position:absolute;
	text-align:right;
	bottom: 10px;
	right: 10px;
}
.rank_list .rankDieter img {
	width: 56px;
	height: auto;
	margin: 0 0 0 10px;
}

@media screen and (max-width: 480px) {
	.rank_list .rankDieter img { width: 28px; }
}

.rankDieter a {
	font-size: 1.2rem;
	line-height: 1.6rem;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

@media screen and (max-width: 480px) {
	.rankDieter a {
		font-size: 1rem;
		line-height: 1.4rem;
	}
}

ul.rank_list li .rank_text{
	width:70%;
	position:relative;
	line-height: 0;
}



/* ---- copyright --------------------------------*/
copyright{
	display:block;
	text-align:center;
	font-size:1.4rem;
	font-weight:normal;
	color: #ffffff;
	margin:0 auto 0 auto;
	width: 100%;
	background: #4a4a4a;
	padding: 20px 0 !important;
	margin: 100px 0 0 0 !important;
}

/* ---- popup dialog style -------*/
div.dialog-dialog {
    background-color:#fff;
    box-sizing:border-box;
    padding:35px 20px 25px 20px!important;
}
div.dialog-dialog .yesno:hover {
    background-color:#953735;
}
div.diglog-closeButton:hover {
    background-color:#fff !important;
}
div.dialog-dialog h3 {
	font-size: 1.5rem!important;
	color: #1a1a1a!important;
	font-weight: normal!important;
	background:none!important;
	padding:0!important;
	margin:0 auto 10px auto!important;
	text-align:center!important;
}
div.dialog-dialog h4 {
    /*border-radius:10px;
    background-color:#F2DCDB;
    border:2px solid #953735;*/
    text-align:center;
    margin:0 auto 20px auto;
    height:40px;
    line-height:40px;
    font-size:1.6em;
}
div.dialog-dialog .desc {
    background:#fff;
    text-align:left;
    margin-left:auto;
    margin-right:auto;
    width:100%;
    padding:10px 0;
    font-size:1.4rem;
    border-radius:5px;
}
div.dialog-dialog .ui-input-text input{
	background-color:#eee;
	border-radius: 0px;
}
div.dialog-dialog .ui-input-text{
	border-width: 0px;
}
div.dialog-dialog .ui-shadow-inset{
	box-shadow:0 0 0;
}
div.dialog-dialog .ui-btn{
    width:auto;
    padding:10px;
    color:#fff !important;
    text-shadow:none !important;
	box-shadow:none!important;
    text-align:center;
    background-color:#E1833D!important;
    border-radius:0px;
    -webkit-border-radius:0px;
    -moz-border-radius:0px;
	border:1px solid #E1833D!important;
}
div.dialog-dialog .ui-btn.no{
	background-color:#fff!important;
	color:#E1833D!important;
}
div.dialog-dialog .ui-btn:hover{
	background-color:#9AD5FF;
	color:#fff!important;
}

.recommendDieter a {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: center;
	align-items: center;
	color: #4a4a4a;
	text-decoration: none;
}

.dieterProfIcn { margin: 10px 0 0 10px; }

.recommendProf {
	text-align: right;
	margin: 10px 0 0 0;
	font-size: 1.2rem;
}

@media screen and (max-width: 480px) {
	.recommendProf {
		font-size: 1rem;
		line-height: 1.2rem;
	}
}

.dieterProfIcn img {
	width: 40px;
	height: auto;
}

@media screen and (max-width: 480px) {
	.dieterProfIcn img { width: 28px; }
}

.dieterBox {
    display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	-webkit-flex-direction: row;
	flex-direction: row;
    margin: 0 0 30px 0;
}

.dieterBox:nth-child(even) {
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

.creator .dieterBox {
	-webkit-flex-direction: row;
	flex-direction: row;
}

.dieterImg { width: 48%; }

.dieterImg img {
    max-width: 100%;
}

.dieterProf {
    padding: 0 10px;
    margin: 0 auto;
    text-align: left;
    box-sizing: border-box;
}

.dieterProf a {
	color: #4a4a4a;
}

.dieterProf span {
    display: block;
}

.dieterBox .dieterProf span {
	padding: 0 0 10px 0;
	font-size: 1.6rem;
	line-height: 1.6rem;
}

@media screen and (max-width: 480px) {
	.dieterBox .dieterProf span {
		font-size: 1.4rem;
		line-height: 1.4rem;
	}
}

.dieterBox .dieterProf span.dieterCatch {
	font-size: 2rem;
	line-height: 2.8rem;
	font-weight: bold;
}

@media screen and (max-width: 480px) {
	.dieterBox .dieterProf span.dieterCatch {
		font-size: 1.8rem;
		line-height: 2.6rem;
	}
}

.dieterBox .dieterProf i {
	display: inline-block;
	margin: 0 3px 0 0 ;
}

.dieterBox .dieterProf .achievement {
	background: #4a4a4a;
	color: #ffffff;
	display: inline-block;
	text-align: center;
	padding: 4px 10px;
}

.baNotes {
	margin: 0 auto 30px auto;
	width: 94%;
}

.baNotes dt {
	font-weight: bold;
	font-size: 1.4rem;
	margin: 0 0 20px 0;
	text-align: center;
}

.baNotes dd {
	font-size: 1.2rem;
	line-height: 2rem;
}

/* FAQ */
*:focus { outline: none; }

/*ボックス全体*/
.faqContent {
    margin: 0 auto;
    max-width: 768px;
    padding: 10px;
}

.accbox {
    margin: 0 0 40px 0;
    padding: 0;
    max-width: 768px;/*最大幅*/
}

.accbox .accIn {
    border-left: 1px solid #4a4a4a;
    display: block;
    padding:  0 25px 0 1.6em;
    text-indent: -1.6em;
	position: relative;
}

.accbox .accIn span {
	color: #9a9a9a;
	padding: 0 3px 0 5px;
}

/*ラベル*/
.accbox label {
    display: block;
    font-weight: bold;
    cursor :pointer;
    transition: all 0.5s;
}

/*アイコンを表示*/
.accbox .accIn:after {
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f078";
	display: inline-block;
	position: absolute;
	right: -15px;
	top: auto;
	color: #9a9a9a;
	font-size: 12px;
}

/*ラベルホバー時*/
.accbox label:hover {
    -webkit-tap-highlight-color: none;
}

/*チェックは隠す*/
.accbox input {
    display: none;
}

.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.3s;
}

.cssacc:checked + label + .accshow {
    height: auto;
    padding: 20px 0 0 0;
    opacity: 1;
    line-height: 2.6rem;
}

.accbox .accshow p {
    margin: 15px 10px}

/*アイコンを入れ替える*/
.cssacc:checked + label .accIn:after {
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f077";
	display: inline-block;
	position: absolute;
	right: -15px;
	top: auto;
	color: #9a9a9a;
	font-size: 12px;
}

.faqImg {
    text-align: center;
    margin: 0 0 10px 0;
}

.faqImg img {
    max-width: 100%;
    height: auto;
}

.accbox div font {
    line-height: 2.2rem;
}

.footer_box {
	border-top: solid 1px #dddddd;
	padding: 10px 0 0 0 !important;
	display: -webkit-flex !important;
	display: flex !important;
	-webkit-justify-content: space-between !important;
	justify-content: space-between !important;
	-webkit-align-items: flex-start !important;
	align-items: flex-start !important;
	margin: 0 auto 100px auto !important;
}

.footer_box li {
	width: 50% !important;
	text-align: left !important;
	font-size: 1.4rem;
	padding: 0 0 10px 0 !important;
}

.footer_box li a:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f138";
	display: inline-block;
	padding: 0 3px 0 0;
}

.adsense_box {
	padding : 30px 10px !important;
	text-align: center !important;
}
