@charset "utf-8";
/*
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
@import url(//fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);
*/

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

/*要素のフォントサイズやマージン・パディングをリセットしています*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}

/*行の高さをフォントサイズと同じにしています*/

body {
	line-height: 1;
}

/*新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています*/

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

/*nav要素内ulのマーカー（行頭記号）を表示しないようにしています*/

/*nav ul {
  list-style:none;
  }*/

ol, ul {
	list-style: none;
}

/*引用符の表示が出ないようにしています*/

blockquote, q {
	quotes: none;
}

/*blockquote要素、q要素の前後にコンテンツを追加しないように指定しています*/

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

/*a要素のフォントサイズなどをリセットしフォントの縦方向の揃え位置を親要素のベースラインに揃えるようにしています*/

a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/* ins要素のデフォルトをセットし、色を変える場合はここで変更できるようにしています */
/*
ins {
	background-color: #ff9;
	color: #000;
	text-decoration: none;
}
*/
/* mark要素のデフォルトをセットし、色やフォントスタイルを変える場合はここで変更できるようにしています
また、mark要素とは、文書内の検索結果で該当するフレーズをハイライトして、目立たせる際に使用するようです。*/

mark {
	background-color: #ff9;
	color: #000;
	font-style: italic;
	font-weight: bold;
}

/*テキストに打ち消し線が付くようにしています*/

del {
	text-decoration: line-through;
}

/*IEではデフォルトで点線を下線表示する設定ではないので、下線がつくようにしています
また、マウスオーバー時にヘルプカーソルの表示が出るようにしています*/

abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

/*隣接するセルのボーダーを重ねて表示し、間隔を0に指定しています*/

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*水平罫線のデフォルトである立体的な罫線を見えなくしています*/

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #cccccc;
	margin: 1em 0;
	padding: 0;
}

/*縦方向の揃え位置を中央揃えに指定しています*/

input, select {
	vertical-align: middle;
}

/*画像を縦に並べた時に余白が出ないように*/

img {
	vertical-align: top;
	font-size: 0;
	line-height: 0;
}

/*box-sizingを全ブラウザに対応*/

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

.none {
	display: none;
}

/* darkmode定義 */

@media (prefers-color-scheme: light) {
	:root {
		--main-txt-color: #333;
		--main-bg-color: #fff;
	}
}

@media (prefers-color-scheme: dark) {
	:root {
		--main-txt-color: #fff;
		--main-bg-color: #333;
	}
}

body {
	min-height: 100vh;
	color: var(--main-txt-color, #333);
	background-color: var(--main-bg-color, #fff);
}

/* 表示フォントの設定 */

body {
	font-family: "ナウ-GM", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/*font-family: sans-serif;*/
	font-size: 14px;
}

@media all and (-ms-high-contrast:none) {
	body {
		font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		/* ヒラギノと游ゴシックがずれるので、IE11は除外する */
	}
}

.mincho {
	/*font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/
	font-family: serif;
}

a:hover {
	opacity: 0.9;
}

/*
@media(max-width:1024px){
	a:hover{
		opacity:1;
	}
}
*/

.pc {
	display: inherit;
}

.pc2 {
	display: inherit;
}

.sp {
	display: none;
	/* 1024以下で */
}

.sp2 {
	display: none;
	/* 768以下で */
}

@media(max-width:1024px) {
	.pc {
		display: none;
	}
	.sp {
		display: inherit;
	}
}

@media(max-width:767px) {
	.pc2 {
		display: none;
	}
	.sp2 {
		display: inherit;
	}
}

/* ************************************************** */

body {
	/* */
}

/* ************************************************** */

header {
	/* */
}

#contents, footer {
	/* */
}

/* ************************************************** */

#contents {
	width: 100%;
	text-align: center;
}



#contents .contents-inner {
	text-align: left;
	display: inline-block;
	vertical-align: top;
	max-width: 780px;
	/* 1120 - 300 - 40 */
	width: 100%;
}

#contents.mypage .contents-inner{
	padding-bottom:100px;
	max-width:100vw;
}

#contents.information .contents-inner{
	padding:80px 0 100px 0;
}

h2.pub-h2{
	font-size:18px;
	color:#333333;
	margin: 0 auto;
	padding:51px 0;
	background-color:#e9f4f5;
	text-align:center;
	display: block;
}


/* ************************************************** */

header {
	/* */
	background-color:#ffffff;
}
header .inner{
	width:100%;
	max-width:960px;
	margin:0 auto;
}
header h1{
	display: inline-block;
	vertical-align: middle;
	padding:17px 0;
	margin-right:60px;
}
header h1 img{
	width:130px;
	height:auto;
}
header .head-menu{
	display: inline-block;
	vertical-align: middle;
	width:calc(100% - 130px - 60px);
}
header .head-menu ul{
	display: inline-block;
	vertical-align: middle;
	
}
header .head-menu ul li{
	display: inline-block;
	vertical-align: middle;
	margin-right:30px;
	
}
header .head-menu ul li:last-of-type{
	margin-right:0;
}
header .head-menu ul li a{
	color:#666666;
	font-size:14px;
	text-decoration: none;
	
}
header .menu-box{
	float:right;
	text-align: right;
}
header .menu-box .menu{
	display: inline-block;
	vertical-align: middle;
	margin-right:24px;
}

header .menu-box .menu a{
	font-size:14px;
	padding:3px 0;
	text-decoration: none;
	color:#666666;
	display: inline-block;
}
header .menu-box .menu a:hover{
	color:#44989e;
}
header .menu-box .menu.login,
header .menu-box .menu.mypage{
	margin-right: 0;
}
header .menu-box .menu.login a{
	
	padding-left:24px;
	background-image:url("../images/common/icon_login.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size:15px auto;
}

header .menu-box .menu.logout a{
	
	background-image:url("../images/common/icon_logout.png");
	background-repeat: no-repeat;
	background-position: left 20px center;
	background-size:15px auto;
	margin-left:20px;
	border-left:1px solid #cccccc;
	padding:3px 0 3px 44px;
}


header .menu-box .menu.register{
	margin-left:20px;
	padding-left:20px;
	border-left:1px solid #cccccc;
}


/* ************************************************** */

footer {
	/* */
	background-color:#44989e;
	padding:30px 0 45px 0;
	text-align: center;
}

footer ul{
	margin-bottom:50px;
}
footer ul li{
	font-size:14px;
	margin-right: 30px;
	display: inline-block;
	vertical-align: top;
}
footer ul li:last-of-type{
	margin-right:0;
}
footer ul li a{
	color:#ffffff;
	text-decoration: none;
}
footer .logo{
	margin-bottom:50px;
}
footer .logo img{
	width:130px;
	height:auto;
}
footer .copyright{
	font-size:11px;
	color:#98c8cb;
}


/* ************************************************** */

#main {
	/* */
}

.information #main{
	background-color:#e9f4f5;
}

/* ************************************************** */


.page-body {
	margin-top: 80px;
}

.page-body p {
	color: #333333;
	font-size: 16px;
	line-height: 32px;
	margin-bottom: 30px;
}

.page-body h3 {
	color: #333333;
	font-weight: bold;
	font-size: 24px;
	line-height: 32px;
	margin-bottom: 30px;
}

.page-body p sup{
	font-size:80%;
	font-style: italic;
	vertical-align: super;
}

.page-body p.notice{
	font-size:80%;
}


.page-body blockquote p {
	padding-left:1em;
	font-style: italic;
}

.page-body a {
	display: inline;
	border-bottom: 1px dotted #333333;
	text-decoration: none;
}

.page-body a.otherlink {
	font-size: 16px;
	line-height: 1;
	color: #3d76f5;
	border: 2px solid #3d76f5;
	width: 300px;
	padding: 22px 0;
	border-radius: 30px;
	margin: 30px auto 0 auto;
	display: block;
	text-align: center;
}

.page-body .figure {
	padding: 10px 0 40px 0;
}

.page-body .figure .inner {
	width: 100%;
	margin-bottom: 6px;
}

.page-body .figure .inner img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
	width: auto;
	height: auto;
}

.page-body .figure .caption {
	font-size: 12px;
	line-height: 18px;
}

.page-body .writer {
	padding-top: 38px;
	margin-top: 38px;
	border-top: 1px solid #eeeeee;
	font-size: 0;
}

.page-body .writer .fig {
	display: inline-block;
	vertical-align: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	width: 80px;
	border-radius:40px;
}

.page-body .writer .fig img {
	width: 100%;
	height: auto;
}

.page-body .writer .text {
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 80px);
	padding-left: 20px;
}

.page-body .writer .text h4 {
	font-size: 14px;
	color: #000000;
	line-height: 1;
	padding-bottom: 20px;
}
.page-body .writer .text .proffollow{
	float:right;
	padding:4px 8px;
	border:1px solid #cccccc;
	border-radius:2px;
	margin-top:-32px;
	cursor: pointer;
}
.page-body .writer .text .proffollow img{
	width:66px;
	height:auto;
}



.page-body .writer a{
	color:#000000;
	text-decoration: none;
	border-bottom:none;
}


.page-body .writer .text p {
	font-size: 12px;
	line-height: 20px;
	color: #333333;
}

/* ************************************************** */


.comment-body {
	font-size: 0;
	margin-bottom: 0;
}

.comment-body ul li {
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #eeeeee;
}

.comment-body ul li:last-child {
	border-bottom: none;
}

.comment-body form ul li:last-child {
	border-bottom: 1px solid #eeeeee;
}

.comment-body .fig {
	display: inline-block;
	vertical-align: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	width: 40px;
	border-radius:20px;
}

.comment-body .fig img {
	width: 100%;
	height: auto;
}

.comment-body .text {
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 40px);
	padding-left: 40px;
}

.comment-body .text h4 {
	font-size: 16px;
	color: #000000;
	line-height: 1;
	padding-bottom: 10px;
}
.comment-body .text .date{
    font-size:10px;
    margin-bottom:8px;
}
.comment-body .text h4 a{
	color:#000000;
	text-decoration: none;
}
.comment-body .text h4 a:hover{
	color:#44989e;
	text-decoration: underline;
}
.comment-body .text .likefollow{
	width:239px;
	float:right;
	margin-top: -36px;
	text-align:right;
}

.comment-body .text .likefollow .edit{
	cursor: pointer;
	display: inline-block;
	vertical-align: top;
	margin-right:10px;
	position: relative;
}
.comment-body .text .likefollow .edit .editbox{
	width:100px;
	background-color:#ffffff;
	border:1px solid #dddddd;
	padding:0;
	position: absolute;
	top:26px;
	right:0;
	z-index: 1;
}
.comment-body .text .likefollow .edit .editbox ul{
	
}
.comment-body .text .likefollow .edit .editbox ul li{
	background-position: left 22px center;
	background-size:20px auto;
	background-repeat: no-repeat;
	margin-bottom: 0;
	font-size:14px;
	color:#333333;
	padding:16px 22px;

}
.comment-body .text .likefollow .edit .editbox ul li:hover{
	background-color:#eeeeee;
}
.comment-body .text .likefollow .edit .editbox ul li.editbox-modify{
	background-image:url("../images/common/icon_edit.png");
}
.comment-body .text .likefollow .edit .editbox ul li.editbox-modify2{
	background-image:url("../images/common/icon_edit.png");
}
.comment-body .text .likefollow .edit .editbox ul li.editbox-delete{
	background-image:url("../images/common/icon_delete.png");
	
}
.comment-body .text .likefollow .edit .editbox ul li.editbox-delete2{
	background-image:url("../images/common/icon_delete.png");
	
}
.comment-body .text .likefollow .edit .editbox ul li.editbox-userban{
	background-image:url("../images/common/icon_ban.png");
	
}
.comment-body .text .likefollow .edit .editbox ul li.editbox span{
	padding-left:22px;
}


.comment-body .text .likefollow .edit:hover{
	background-color:#eeeeee;
}

.comment-body .text .likefollow .follow{
	padding:4px 8px;
	border:1px solid #cccccc;
	border-radius:2px;
	cursor: pointer;
	display: inline-block;
	vertical-align: top;
	margin-right:10px;
}
.comment-body .text .likefollow .follow:hover{
	background-color:#eeeeee;
}
.comment-body .text .likefollow .follow img{
	width:66px;
	height:auto;
}


.comment-body .text .likefollow .like{
	border:1px solid #cccccc;
	border-radius:2px;
	width:109px;
	text-align:center;
	padding:5px 0 6px 0;
	cursor: pointer;
	display: inline-block;
	vertical-align: top;
}
.comment-body .text .likefollow .like:hover{
	background-color:#eeeeee;
}
.comment-body .text .likefollow .like img{
	width:52px;
	height:auto;
	margin-right:16px;
}
.comment-body .text .likefollow .like span{
	font-size:12px;
	color:#666666;
	font-style: italic;
	display: inline-block;
	padding: 4px 0 0 0;
}

.comment-body .text p {
	font-size: 12px;
	line-height: 20px;
	color: #333333;
}

.comment-body .text .delete{
	font-size:12px;
	line-height: 20px;
	padding:10px 0 0 0;
}
.comment-body .text .delete a{
	color:#990000;
	text-decoration: none;
}


.comment-body .text textarea {
	width: 100%;
	height: auto;
	border: 1px solid #eeeeee;
	border-radius: 6px;
	padding: 8px 14px;
	font-size: 14px;
	line-height: 20px;
	color: #999999;
	margin-bottom: 30px;
}
.comment-body .text textarea.commenttext{

	margin-bottom: 10px;
}

.comment-body .text .share{
	display: inline-block;
	vertical-align: middle;
	margin-right:20px;
}
.comment-body .text .share p{
	font-size:14px;
	color:#666666;	
	display: inline-block;
	vertical-align: middle;
	margin-right:20px;
}
.comment-body .text .share .sns{
	display: inline-block;
	vertical-align: middle;	
}
.comment-body .text .share .sns .btn{
	width:20px;
	height:20px;
	display: inline-block;
	vertical-align: middle;
	margin-right:10px;
	cursor: pointer;
}


.comment-body .text button {
	display: inline-block;
	vertical-align: middle;
	margin: 0 auto;
	font-size: 14px;
	line-height: 1;
	color: #000000;
	width: 120px;
	text-align: center;
	padding: 15px 0;
	background-color: #e2e9ec;
	border: none;
	border-radius: 22px;
	cursor: pointer;
}
.comment-body .text button.reform{
	margin-left:20px;
}

.comment-body .text button:hover {
	background-color:#cae1eb;
}

.comment-body .gologin {
	text-align: center;
	position: relative;
	padding: 0 0 40px 0;
}

.comment-body .gologin a {
	color: #000000;
	text-decoration: none;
	display: inline-block;
	font-size: 14px;
	line-height: 20px;
	padding-right: 20px;
	background-image: url("../images/common/arrow-right.png");
	background-position: right center;
	background-size: 12px auto;
	background-repeat: no-repeat;
}

.comment-body .gologin a:hover {
	text-decoration: underline;
}
/*
.comment-body .gologin:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100px;
	background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	left: 0;
	top: -150px;
}
*/
.comment{
	
}
.comment #navi{
	display:none;
}
.comment .commentpost{
	width:100%;
	background-color:#ffffff;
	padding:30px;
	margin:60px auto 0 auto;
}
.comment .commentpost h2{
	font-size:18px;
	line-height:24px;
	color:#333333;
	margin-bottom:10px;
}
.comment .commentpost h2 span{
	font-size:14px;
}

.comment .commentpost .notice{
	font-size:14px;
	line-height:20px;
	color:#333333;
	margin-bottom:16px;
	padding-left: 40px;
}

.comment .commentpost .commentmsg{
	font-size:14px;
	line-height:20px;
	color:#333333;
	border:1px solid #eeeeee;
	padding:10px;
	margin:0 auto 30px auto;
}

.comment .commentpost .loginmsg{
	font-size:14px;
	line-height:20px;
	color:#fb46a4;
	margin:0 auto 30px auto;
}

.comment .commentpost #login dl{
	width:100%;
	margin:0 auto;
}
.comment .commentpost #login dl dt{
	width:100%;
	margin:0 auto 10px auto;
	color:#333333;
	font-size:14px;
}
.comment .commentpost #login dl dd{
	width:100%;
	margin:0 auto 30px auto;
}
.comment .commentpost #login dl dd:last-of-type{
	margin:0 auto 40px auto;
}

.comment .commentpost #login dl dd input{
	width:100%;
	border:1px solid #cccccc;
	border-radius:4px;
	padding:18px 10px;
	font-size:14px;
	color:#000000;
}
.comment .commentpost #login label{
	font-size:16px;
	color:#333333;
	display: block;
	margin-bottom:40px;
	text-align: center;
}
.comment .commentpost #login label input{
	margin-right:20px;
	width:16px;
	height:16px;
}





/* ************************************************** */
/* ログイン */

#contents.member{
	background-color:#ffffff;
}
#contents.member.account{
	background-color:#ffffff;
}

#contents.member #navi,
#contents.member aside
{
	display: none;
}
#contents.member .contents-inner{
	max-width:100vw;
}

#contents.member #login{
	max-width:440px;
	width:100%;
	margin:0 auto;
	padding:90px 20px 40px 20px;
}

#contents.member #login h2{
	font-size:18px;
	color:#333333;
	margin-bottom:40px;
	text-align:center;
}
#contents.member #login p{
	font-size:14px;
	line-height:20px;
	color:#333333;
	margin-bottom:30px;
	text-align:center;
}
#contents.member #login p a{
	color: #5587e7;
	text-decoration: none;
}
#contents.member #login p.notice{
	text-align:left;
	margin-bottom: 50px;
}
#contents.member #login .sns{
	
}
#contents.member #login .sns ul{
	margin-bottom:40px;
}
#contents.member #login .sns ul li{
	margin:0 auto 10px auto;
	max-width:320px;
}
#contents.member #login .sns ul li:last-child{
	margin-bottom:0;
}
#contents.member #login .sns ul li a{
	display: block;
	padding:15px 0 15px 34px;
	text-align:left;
	color:#ffffff;
}
#contents.member #login .sns ul li a.fb{
	background-color:#1877f2;
}
#contents.member #login .sns ul li a.tw{
	background-color:#1da1f2;
}
#contents.member #login .sns ul li a.ln{
	background-color:#2867b2;
}
#contents.member #login .sns ul li a img{
	width:30px;
	height:auto;
	display: inline-block;
	vertical-align: middle;
	margin-right:18px;
}
#contents.member #login .sns ul li a span{
	display: inline-block;
	vertical-align: middle;
	font-weight:bold;
	font-size:16px;
}

#contents.member #login .or{
	font-size:14px;
	color:#333333;
	text-align:center;
	margin-bottom:20px;	
}



#contents.member #login dl{
	width:100%;
	margin:0 auto;
}
#contents.member #login dl dt{
	width:100%;
	margin:0 auto 10px auto;
	color:#333333;
	font-size:14px;
}
#contents.member #login dl dd{
	width:100%;
	margin:0 auto 30px auto;
	position: relative;

}
#contents.member #login dl dd:last-of-type{
	margin:0 auto 40px auto;
}

#contents.member #login.signup.confirm dl{
	border-top:1px solid #cccccc;
}
#contents.member #login.signup.confirm dl:last-of-type{
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	margin-bottom:80px;
}
#contents.member #login.signup.confirm dl dt{
	width:41.5%;	/*166/400*/
	display: inline-block;
	vertical-align: top;
	padding:24px 0;
	margin:0;
}
#contents.member #login.signup.confirm dl dd{
	width:58.5%;	/*234/400*/
	display: inline-block;
	vertical-align: top;
	padding:24px 0;
	margin:0;

}

#contents.member #login dl dd input{
	width:100%;
	border:1px solid #cccccc;
	border-radius:4px;
	padding:18px 10px;
	font-size:14px;
	color:#000000;
}
#contents.member #login dl dd input.pass{
	padding-right:40px;
}
#contents.member #login dl dd .showpass{
	position:absolute;
	right: 11px;
	top: 18px;
	width: 24px;
	height:auto;
	cursor: pointer;
}
#contents.member #login label{
	font-size:16px;
	color:#333333;
	display: block;
	margin-bottom:40px;
	text-align: center;
}
#contents.member #login label input{
	margin-right:20px;
	width:16px;
	height:16px;
}


#contents.member #login  .rule{
	margin: 0 auto 40px auto;
}
#contents.member #login  .rule li{
	margin-bottom: 16px;
	text-align: center;
}
#contents.member #login  .rule li input[type=checkbox]{
	font-size: 14px;
	color: #000000;
	padding: 6px 8px;
	border: 1px solid #cccccc;
	border-radius: 4px;	
}
#contents.member #login  .rule li a{
	text-decoration: underline;
	color: #333333;
}




#contents.member #login button{

	border-radius:4px;
	font-size:16px;
	line-height: 1;

	padding:22px 0;
	width:100%;
	cursor: pointer;
	margin-bottom:20px;
	color: #44989e;
	border: 1px solid #44989e;
	background-color: #fff;
}
#contents.member #login button:hover{
	background-color:#44989e;
	color:#ffffff;
}
#contents.member #login button.return{
	margin-bottom:40px;
}

#contents.member #login .forget{
	margin-bottom:40px;
	display: block;
	text-align: center;
}
#contents.member #login .forget li{
	margin-bottom:16px;
}
#contents.member #login .forget li:last-of-type{
	margin-bottom:0;
}
#contents.member #login .forget li a{
	color:#5587e7;
	font-size:14px;
	text-decoration: none;
}
#contents.member #login .newsignup{
	margin:0;
	display: block;
	text-align: center;
}

#contents.member #login .newsignup li{
	margin-bottom:0;
}
#contents.member #login .newsignup li a{
	color:#5587e7;
	font-size:14px;
	text-decoration: none;
}


#contents.member #login a.btn{
	width:120px;
	font-size:14px;
	padding:15px 0;
	border-radius:22px;
	background-color:#e2e9ec;
	color:#000000;
	display: block;
	margin:0 auto;
	text-align: center;
	text-decoration: none;
}


/* ************************************************** */

.mypage #navi{
	display:none;
}
.mypage #mypage{
	background-color:#ffffff;
	padding:40px;
	margin-bottom: 40px;
}

.mypage .page-body{
	margin-top:0;
}
.mypage .page-body .writer{
	margin-bottom:20px;
	border-top:none;
	padding-top: 0;
	margin-top: 0;
}

.mypage .page-body .writer .text .good{
	font-size:12px;
	color:#999999;
	font-style:italic;
	margin-top: -22px;
	float: right;
}
.mypage .page-body .writer .text .good span{
	padding-right:4px;
}

.mypage .writer .followaction{
	padding:20px 0 0 0;
}
.mypage .page-body .writer .setting{
	line-height:1;
	display: block;
	padding:0;
	float:right;
	margin-top: -42px;
	
}
.mypage .page-body .writer .setting a{
	color:#44989e;
	font-size:12px;
	padding:8px 16px;
	display: block;
	border-radius:4px;
	border:1px solid #44989e;
}

.mypage .profnavi{
	background-color:#ffffff;
	margin-bottom:20px;
}
.mypage ul.countstatus{
	border-top:1px solid #44989e;
	border-bottom:1px solid #44989e;
	
}
.mypage ul.countstatus li{
	display: inline-block;
	vertical-align: top;
	cursor: pointer;	
}
.mypage .profnavi ul.countstatus li{
	padding:20px 0;
	margin-left:30px;
}
.mypage .profnavi ul.countstatus li.current{
	border-bottom:2px solid #44989e;
	padding: 20px 0 21px 0;
}
.mypage .profnavi ul.countstatus li.goodcnt{
	float: right;
	font-size: 12px;
	font-style: italic;
	padding-top: 26px;
}


.mypage ul.countstatus li .cnt{
	font-size:16px;
	font-weight:bold;
	color:#000000;
	padding-right:6px;
	padding-top:2px;
	display: inline-block;
}
.mypage ul.countstatus li .label{
	font-size:12px;
	color:#666666;	
	padding-top:2px;
	display: inline-block;
}
.mypage ul.countstatus li.likes{
	padding-left:26px;
	background-image:url("../images/common/icon-like_on.png");
	background-repeat: no-repeat;
	background-size:20px auto;
	background-position: left center;
}
.mypage ul.countstatus li.follow{
	
}
.mypage ul.countstatus li.follower{
	
}




.mypage #article-list article .lead{
	font-size:13px;
	line-height:20px;
}
.mypage .likesbody article .label .category{
	display: inline-block;
	vertical-align: middle;
	margin-right:10px;
	padding-right:10px;
	border-right:1px solid #666;
	line-height: 1;
}


.mypage #article-list article .label .likesuser{
	display: inline-block;
	vertical-align: middle;
}
.mypage #article-list article .label .countstatus{
	display: inline-block;
	vertical-align: middle;
	margin-right:12px;
}
.mypage #article-list article .label .countstatus  li.likes{

}
.mypage #article-list article .label .countstatus  li.likes .cnt{
	font-size:14px;
}
.mypage #article-list article .label .countstatus  li.likes .label{
	float:none;
	position:static;
	padding:0;
}


.mypage #article-list article .label .figlist{
	display: inline-block;
	vertical-align: middle;
}
.mypage #article-list article .label .figlist a{
	display: inline-block;
	vertical-align: middle;
	margin-right:2px;
}
.mypage #article-list article .label .figlist .fig{
	width:22px;
	height:22px;
	border-radius:11px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size:cover;
	
}
.mypage #article-list article .label .figlist .fig img{
	width:22px;
	height:22px;
}
.mypage #article-list article .date{
	display: none;
}

.mypage .followlist{
	
}
.mypage .followlist ul{
	
}
.mypage .followlist ul li{
	width:calc( ( 100% - 36px ) / 3 );
	margin-right:18px;
	margin-bottom:18px;
	background-color:#f2f8f9;
	display: inline-block;
	vertical-align: top;
	padding:20px;

}
.mypage .followlist ul li:nth-child(3n){
	margin-right:0;
}
.mypage .followlist ul li a{
	text-decoration: none;
	color:#000000;
}
.mypage .followlist ul li .fig{
	width:40px;
	height:40px;
	border-radius: 20px;
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center center;
	margin-right:20px;
	vertical-align: middle;
	display: inline-block;
	
}
.mypage .followlist ul li .fig img{ 
	
}
.mypage .followlist ul li .text{
	width:calc(100% - 60px);
	vertical-align: middle;
	display: inline-block;
}
.mypage .followlist ul li .text h4{
	font-size:16px;
	line-height:20px;
	font-weight:bold;
}
.mypage .followlist ul li .follow,
.mypage .followlist ul li .follower{

	display: inline-block;
	vertical-align: middle;
	margin-top:30px;
	margin-right:20px;
}
.mypage .followlist ul li .follower{
	margin-right:0;
}
.mypage .followlist ul li .follow .cnt,
.mypage .followlist ul li .follower .cnt{

	text-align:center;
	padding-right: 0;
	padding-top: 0;
	display: inline-block;
	vertical-align: bottom;
	margin-right:4px;
	font-size:14px;
	color:#000000;
	font-weight: bold;
}
.mypage .followlist ul li .follow .label,
.mypage .followlist ul li .follower .label{
	text-align:center;
	padding-top: 0;
	display: inline-block;
	vertical-align: bottom;
	font-size:10px;
	color:#666666;
}


.mypage .writer .followaction,
.mypage .followlist ul li .followaction{
	font-size: 12px;
	display: block;
	vertical-align: middle;
	color:#666666;
	margin-top:16px;
	width:92px;
	padding:4px 6px;
	text-align:center;
	border:1px solid #cccccc;
	cursor: pointer;
	background-color:#ffffff;
}



.mypage .writer .followaction span,
.mypage .followlist ul li .followaction span{
	padding-left:18px;
	background-image:url("../images/common/icon-follow.png");
	background-size:18px auto;
	background-repeat: no-repeat;
	background-position:left center;
	display: inline-block;
	line-height:18px;
}
.mypage .writer .followaction.active span,
.mypage .followlist ul li .followaction.active span{
	background-image:url("../images/common/icon-follow_on.png");
}

.mypage .latestbody{

}
.mypage .latestbody ul{

}
.mypage .latestbody ul li{
	padding:20px;
	display: block;
	background-color:#f2f8f9;
	margin-bottom:20px;
	background-image:url("../images/common/article-point-latest.png");
	background-position:right bottom;
	background-repeat: no-repeat;
	background-size:20px auto;
}
.mypage .latestbody ul li dl dt{
	margin-bottom:14px;
}
.mypage .latestbody ul li dl dt{
	font-size:12px;
	color:#666666;
}
.mypage .latestbody ul li dl dt .fig{
	display: inline-block;
	vertical-align: middle;
	margin:0 8px;
	width:24px;
	height:24px;
	overflow: hidden;
	border-radius:12px;
}
.mypage .latestbody ul li dl dt .fig a{
	border:none;
	text-decoration: none;
}
.mypage .latestbody ul li dl dt .fig img{
	width:100%;	
}
.mypage .latestbody ul li dl dt .fig span{
	display: inline-block;
	vertical-align: middle;
	font-size:14px;
	color:#000000;
}

.mypage .latestbody ul li dl dd{

}
.mypage .latestbody ul li dl dd a{
	text-decoration: none;
}
.mypage .latestbody ul li dl dd a:hover{

}
.mypage .latestbody ul li dl dd {

}
.mypage .latestbody ul li dl dd .comment-title{
	font-size:20px;
	line-height:28px;
	color:#000000;
	margin-bottom:8px;
}
.mypage .latestbody ul li dl dd .comment{
	font-size:13px;
	line-height:20px;
	color:#666666;
}

.mypage .more{
	font-size:16px;
	color:#44989e;
	border:1px solid #44989e;
	border-radius:4px;
	padding:22px 0;
	max-width:400px;
	width:100%;
	display: block;
	margin:100px auto;
	text-decoration: none;
	text-align: center;
}
.mypage .more:hover{
	background-color:#44989e;
	color:#ffffff;
}


@media(max-width:1160px){
	.mypage .followlist ul li{
		width: calc( ( 100% - 18px ) / 2 );
	}
	.mypage .followlist ul li:nth-child(3n){
		margin-right:16px;
	}
	.mypage .followlist ul li:nth-child(2n){
		margin-right:0;
	}


}





@media(max-width:767px){
	.mypage #article-list article .lead{
		font-size: 11px;
		line-height: 15px;
	}
}

@media(max-width:640px){
	.mypage .followlist ul li{
		width: 100%;
		margin-right:0;
	}
	.mypage .followlist ul li:nth-child(3n){
		margin-right:0;
	}
	.mypage .followlist ul li:nth-child(2n){
		margin-right:0;
	}
}


/* ************************************************** */
#contents.member #news,
#contents.member #mypage{
	max-width:1120px;
	width:100%;
	padding:0;
	margin:0 auto;
	word-wrap: break-word;
	word-break: break-all;
	padding:60px 0 100px 0;
}
#contents.member.mypage #mypage{
	max-width:780px
}
#contents.member #news{
	padding:0 0 100px 0;
}
#contents.member #mypage .bg{
	background-color:#ffffff;
	padding-bottom:80px;
}


#contents.member #news .bg .inner,
#contents.member #mypage .bg .inner{
	max-width:688px;
	width:100%;
	padding:0;
	margin:0 auto;
}


#contents.member .pub-title{
	font-size:18px;
	color:#000000;
	font-weight:bold;
}
#contents.member .pub-title.pub-title2{
	text-align: center;
}
#contents.member .pub-desc{
	margin:50px 0 90px 0;
	font-size:14px;
	line-height:20px;
	color:#333333;
	text-align: center;
}
#contents.member .pub-choice{
	text-align: center;
	margin:0 auto;
}
#contents.member .pub-choice a{
	border:1px solid #cccccc;
	border-radius:4px;
	color:#999999;
	font-size:16px;
	padding:22px 0;
	display: inline-block;
	width:200px;
	margin-right:20px;
	text-decoration: none;
	text-align: center;
}
#contents.member .pub-choice a.yes{
	border:1px solid #44989e;
	color:#44989e;
	margin-right:0;	
}
#contents.member .pub-tagdata{
	margin:20px 0 60px 0;
	width:100%;
	height:114px;
	font-size:13px;
	line-height:20px;
	color:#333333;
	background-color:#f2f8f9;
	padding:20px;
	border:none;
}
#contents.member .pub-copy{
	color:#44989e;
	width:200px;
	border:1px solid #44989e;
	border-radius:4px;
	font-size:16px;
	padding:22px 0;
	text-align: center;
	text-decoration: none;
	margin:0 auto;
	cursor: pointer;
}
#contents.member .pub-copy:hover{
	background-color:#44989e;
	color:#ffffff;
}


#contents.member .commentlist{

}
#contents.member .commentlist .inner{

}
#contents.member .commentlist .inner p{
	font-size:14px;
	line-height:24px;
	color:#333333;
	margin-bottom:50px;
}

#contents.member .commentlist .inner h3{
	font-size:16px;
	color:#333333;
	margin-bottom:40px;
}
#contents.member .commentlist .inner ul{
	
}
#contents.member .commentlist .inner ul li{
	padding:40px 0;
	border-bottom:1px solid #44989e;
}
#contents.member .commentlist .inner ul li div{
	width:calc(100% - 120px);
	display: inline-block;
	vertical-align: middle;
	font-size:18px;
	line-height:24px;
	color:#000000;
}
#contents.member .commentlist .inner ul li div span{
	display:block;
	font-size:14px;
	line-height: 1;
	color:#999999;
	margin-bottom:12px;
}
#contents.member .commentlist .inner ul li a.link{
	text-decoration: none;
	color:#000000;
}
#contents.member .commentlist .inner ul li a.link:hover{
	text-decoration: underline;
}
#contents.member .commentlist .inner ul li a.commentadmin{
	display: inline-block;
	vertical-align: middle;
	width:120px;
	font-size:12px;
	color:#44989e;
	padding:16px 0;
	text-decoration: none;
	border:1px solid #44989e;
	border-radius:4px;
	text-align: center;

}
#contents.member .commentlist .inner ul li a.commentadmin:hover{
	background-color:#44989e;
	color:#ffffff;
}



#contents.member #mypage .inner .return-list{

}
#contents.member #mypage .inner .return-list a{
	display: inline-block;
	background-image:url("../images/common/icon_return.png");
	background-position: left 14px center;
	background-repeat: no-repeat;
	background-size:15px auto;
	border:1px solid #44989e;
	border-radius:4px;
	font-size:12px;
	padding:8px 15px 8px 35px;
	color:#44989e;
	text-decoration: none;
	margin-bottom:20px;
}
#contents.member #mypage .inner .return-list a:hover{
	background-color:#44989e;
	background-image:url("../images/common/icon_return_on.png");
	color:#ffffff;
}

#contents.member #mypage .inner .edit-desc{
	font-size:18px;
	color:#000000;
	margin-bottom:40px;
}



#contents.member #mypage .avator{
	position: relative;
	width:150px;
	height:150px;
	border-radius:75px;

	background-color:#eeeeee;
	display: block;
	margin:-75px auto 40px auto;
}
#contents.member #mypage .avator .figbox{
	width:150px;
	height:150px;
	border-radius:75px;
	overflow:hidden;
	position: relative;
}
#contents.member #mypage .avator .fig{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;


	
}
#contents.member #mypage .avator .addbtn{
	position: absolute;
	bottom:7px;
	right:7px;
	width:30px;
	height:auto;
	cursor: pointer;
}
#contents.member #mypage .score{
	display: block;
	margin:0 auto 40px auto;
	text-align: center;
}
#contents.member #mypage .score ul{
	
}
#contents.member #mypage .score ul li{
	display: inline-block;
	vertical-align: top;
	color:#666666;
	font-size:14px;
	line-height:16px;
	margin-right:20px;
}
#contents.member #mypage .score ul li:last-of-type{
	margin-right:0;
}
#contents.member #mypage .score ul li span{
	display: inline-block;
	vertical-align: middle;
	font-size:16px;
	line-height:16px;
	margin-right:8px;
}

#contents.member #mypage .info{
	font-size:12px;
	line-height:18px;
	margin-bottom:20px;
}
#contents.member #mypage .info span{
	color:#ff0000;
}

#contents.member #mypage .profile{
	margin:0 auto 80px auto;

}
#contents.member #mypage .profile dl{
	border-top:1px solid #eeeeee;
}
#contents.member #mypage .profile dl:last-of-type{
	border-bottom:1px solid #eeeeee;
	margin-bottom:40px;
}
#contents.member #mypage .profile dl dt{
	width:166px;
	display: inline-block;
	vertical-align: top;
	font-size:14px;
	line-height:20px;
	padding:22px 0;
	color:#666666;
}
#contents.member #mypage .profile dl dd{
	width:calc(100% - 166px);
	display: inline-block;
	vertical-align: middle;
	font-size:16px;
	line-height:20px;
	padding:20px 0;
	color:#000000;
}
#contents.member #mypage .profile a{
	text-decoration: none;
	color:#000000;
	font-size:14px;
	text-align: center;
	width:120px;
	padding:16px 0;
	border-radius:23px;
	background-color:#e2e9ec;
	display: block;
	margin:0 auto;
}


#contents.member #mypage .sns{
	margin-bottom:30px;	
}
#contents.member #mypage .sns h3{
	font-size:18px;
	color:#666666;
	font-weight: bold;
	padding-bottom:10px;
	border-bottom:1px solid #eeeeee;
}
#contents.member #mypage .sns ul{
	padding:30px 0;
}
#contents.member #mypage .sns ul li{
	margin-bottom:30px;
	text-align: center;
}
#contents.member #mypage .sns ul li:last-of-type{
	margin-bottom:0;
}
#contents.member #mypage .sns ul li .icon{
	display: inline-block;
	vertical-align: middle;
	margin-right:30px;
	
}
#contents.member #mypage .sns ul li .icon img{
	width:40px;
	height: auto;
}
#contents.member #mypage .sns ul li span{
	display: inline-block;
	vertical-align: middle;
	width:180px;
	text-align: left;
	font-size:14px;
}
#contents.member #mypage .sns ul li .setting{
	display: inline-block;
	vertical-align: middle;
	font-size:14px;
	width:160px;
	border:2px solid #eeeeee;
	padding:13px 0;
	border-radius: 22px;
	text-align: center;
	margin-left:30px;
	cursor: pointer;
	color:#999999;
}
#contents.member #mypage .sns ul li .setting.active{
	background-image:url("../images/common/sns_checked.png");
	background-repeat: no-repeat;
	background-position: left 26px center;
	background-size:16px auto;
	color:#000000;
}


#contents.member #mypage .unsubscribe{
	border-top:1px solid #eeeeee;
	border-bottom:1px solid #eeeeee;
	padding:8px 0;	
}
#contents.member #mypage .unsubscribe h3{
	font-size:14px;
	font-weight: bold;
	color:#000000;
	display: inline-block;
	vertical-align: middle;
	width:calc(100% - 125px);
	text-align: left;
}
#contents.member #mypage .unsubscribe a{
	font-size:14px;
	color:#000000;
	display: inline-block;
	vertical-align: middle;
	text-decoration: none;
	background-color:#f2f8f9;
	padding:15px 0;
	width:120px;
	border-radius:22px;
	text-align: center;
}


#contents.member #mypage .unsubscribe-confirm{
	
}
#contents.member #mypage .unsubscribe-confirm h3{
	margin-bottom:30px;
	font-size:14px;
	line-height: 24px;
	color:#333333;
	text-align: center;
}
#contents.member #mypage .unsubscribe-confirm p{
	margin-bottom:30px;
	font-size:14px;
	line-height: 24px;
	color:#333333;
}
#contents.member #mypage .unsubscribe-confirm p.notice{
	
}
#contents.member #mypage .unsubscribe-confirm button{
	border-radius: 4px;
	font-size: 16px;
	line-height: 1;
	padding: 22px 0;
	width: 200px;
	cursor: pointer;
	margin:0 auto 20px auto;
	color: #44989e;
	border: 1px solid #44989e;
	background-color:transparent;
	display: block;

}
#contents.member #mypage .unsubscribe-confirm button:hover{
	background-color: #44989e;
    color: #ffffff;
}
}


#contents.member #mypage .list{
	margin:0 auto 60px auto;
}
#contents.member #mypage .listdata{
	width:270px;
	display: inline-block;
	vertical-align: top;
	margin-right:40px;
}
#contents.member #mypage .listdata.wide{
	width:100%;
	margin-right:0;
}


#contents.member #mypage .listdata:last-of-type{
	margin-right:0;
}
#contents.member #news .news{
	padding:0;
	border-bottom: 2px solid #666666;
}
#contents.member #mypage .listdata h3,
#contents.member #mypage .fav h3,
#contents.member #news .news h3{
	font-size:16px;
	color:#666666;
	padding:5px 0 10px 0;
	border-bottom:1px solid #666666;
	display: block;
	background-position: left top;
	background-repeat: no-repeat;
	background-size:20px auto;
}
#contents.member #news .news h3{
	font-size:18px;
	border-bottom:2px solid #666666;
	padding:5px 0 8px 0;
}

#contents.member #mypage .listdata.follow h3{
	background-image:url("../images/common/icon-follow_on.png");
}
#contents.member #mypage .listdata.follower h3{
	background-image:url("../images/common/icon-follower.png");
	
}
#contents.member #mypage .fav h3{
	background-image:url("../images/common/icon-like_on.png");
	
}
#contents.member #mypage .listdata h3 span,
#contents.member #mypage .fav h3 span{
	padding-left:26px;
}



#contents.member #mypage .listdata a.all,
#contents.member #mypage .fav a.all,
#contents.member #news .news a.all{
	font-size:14px;
	color:#666666;
	text-decoration: none;
	display: block;
	margin:-26px 0 10px 0;
	text-align:right;
	background-image:url("../images/common/arrow-gray.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size:6px auto;
}
#contents.member #mypage .listdata a.all span,
#contents.member #mypage .fav a.all span,
#contents.member #news .news a.all span{
	padding-right:10px;
}
#contents.member #mypage .listdata ul{
	padding:10px 0 0 0;
	display: block;
}
#contents.member #mypage .listdata ul li{
	padding:0 0 10px 0;
}
#contents.member #mypage .listdata ul li a{
	color:#999999;
	text-decoration: none;
}
#contents.member #mypage .listdata ul li .fig{
	display: inline-block;
	vertical-align: middle;
	width:40px;
	height:40px;
	position: relative;
	margin-right:10px;
}
#contents.member #mypage .listdata ul li .fig img{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}
#contents.member #mypage .listdata ul li .name{
	display: inline-block;
	vertical-align: middle;
	width:calc(100% - 40px - 10px - 90px);
	font-size:16px;
	font-weight: bold;
	color:#000000;
}
#contents.member #mypage .listdata ul li .link{
	display: inline-block;
	vertical-align: middle;
	width:90px;
	font-size:14px;
	color:#999999;
}
#contents.member #mypage .listdata ul li .link a{
	font-size:12px;
	line-height:14px;
	color:#2c87fb;
	text-decoration: none;
}

#contents.member #mypage .fav{
	margin-bottom:60px;
}

#contents.member #mypage .fav dl,
#contents.member #news .news dl{
	padding:20px 0 0 0;

}

#contents.member #mypage .fav dl dt,
#contents.member #news .news dl dt{
	font-size:12px;
	color:#999999;

	padding-top:40px;
	padding-bottom:12px;
	
}
#contents.member #mypage .fav dl dd,
#contents.member #news .news dl dd{
	font-size:20px;
	line-height:30px;
	color:#333333;
	font-weight: bold;
	border-bottom:1px solid #cccccc;
	padding-bottom:40px;
}
#contents.member #mypage .fav dl dt dd:last-of-type,
#contents.member #news .news dl dt dd:last-of-type{
	margin-bottom:0;
	border-bottom:none;
}

#contents.member #mypage .fav dl dd a,
#contents.member #news .news dl dd a{
	color:#666666;
	text-decoration: none;
}
#contents.member #mypage .fav dl dd a:hover,
#contents.member #news .news dl dd a:hover{
	color:#2c87fb;
}



#contents.member #mypage .profile input{
	width:100%;
}
#contents.member #mypage .profile .passform{
	position: relative;
	margin-bottom:20px;
}
#contents.member #mypage .profile .passform:last-of-type{
	margin-bottom:0;
}
#contents.member #mypage .profile input[type=password]{
	width:100%;
	display: inline-block;
	padding-right: 30px;
}
/*
#contents.member #mypage .profile input[type=password]:last-of-type{
	margin-bottom:0;
}
*/
#contents.member #mypage .profile .showpass{
	position: absolute;
	top:4px;
	right:10px;
	width:20px;
	height:auto;
}


#contents.member #mypage .profile textarea{
	font-size:12px;
	line-height:18px;
	color:#333333;
	padding: 12px;
	border: 1px solid #ccc;
	width: 100%;
	height: 180px;
}



#contents.member #mypage .profile .change{
	text-align: center;
	font-size:12px;
	margin-bottom: 20px;
	color: #f00;
}

#contents.member #news .news div.all{
	font-size:14px;
	color:#666666;
	text-decoration: none;
	display: block;
	margin:10px 0 10px 0;
	text-align:right;
}


#contents.member .news-titlebox{
	background-color:#e9f4f5;
	width:100%;
	padding:50px 0;
}
#contents.member .news-titlebox .inner{
	max-width: 688px;
	width: 100%;
	padding: 0 20px;
	margin: 0 auto;
}
#contents.member .news-titlebox .inner .date{
	font-size:12px;
	color:#999999;
	margin-bottom:16px;	
}
#contents.member .news-titlebox .inner h3{
	font-size:20px;
	line-height:30px;
	color:#333333;
	font-weight: bold;
}
#contents.member #news .news.news-content{
	border-bottom:1px solid #cccccc;
	margin-bottom:80px;
}

#contents.member #news .news .content{
	padding:50px 20px;
	font-size:14px;
	line-height:24px;
	color:#333333;
}

#contents.member #news a.ret{
	font-size:16px;
	color:#44989e;
	border:1px solid #44989e;
	border-radius:4px;
	padding:22px 0;
	width:100%;
	max-width:200px;
	display: block;
	margin:0 auto;
	text-decoration: none;
	text-align: center;
}



#contents.member #mypage a.ret{
	text-decoration: none;
	color:#000000;
	font-size:14px;
	text-align: center;
	width:120px;
	padding:16px 0;
	border-radius:23px;
	background-color:#e2e9ec;
	display: block;
	margin:30px auto 0 auto;
}


.rule #navi{
	display: none;
}
.rule aside{
	display: none;
}
#rule{
	background-color:#ffffff;
	padding:50px 20px 20px 20px;
	margin: 30px auto 0 auto;
}
#rule h2{
	font-size: 18px;
	color: #333333;
	margin-bottom: 40px;
	text-align: center;
}
#rule h3{	
	font-size: 16px;
	color: #333333;
	margin-bottom: 20px;
	text-align: left;
}
#rule p{
	font-size: 14px;
	line-height:20px;
	color: #333333;
	margin-bottom: 30px;
	text-align: left;	
}
#rule dl{
	font-size: 14px;
	line-height:20px;
	color: #333333;
	margin-bottom: 30px;
	text-align: left;
}
#rule dl dt{
	display: inline-block;
	vertical-align: top;
	width:30px;
}
#rule dl dd{
	display: inline-block;
	vertical-align: top;
	width:calc(100% - 30px);
	margin-bottom: 10px;
	
}


.information .contact{
	
}
.information .contact h2{
	font-size:18px;
	color:#333333;
	margin-bottom:40px;
	text-align: center;
}
.information .contact .inner{
	
}
.information .contact .inner p{
	color:#333333;
	font-size:14px;
	margin-bottom:40px;
	text-align: center;
}
.information .contact .inner dl{
	
}
.information .contact .inner dl dt{
	font-size:14px;
	color:#333333;
	margin-bottom:10px;
}
.information .contact .inner dl dt span{
	font-size:12px;
	display: inline-block;
	margin-left:10px;
	color:#ff0000;
}
.information .contact .inner dl dd{
	padding-bottom:30px;
	line-height:20px;
}
.information .contact .inner dl dd input{
	font-size:14px;
	padding:20px 10px;
	width:100%;
	border:none;
}
.information .contact .inner dl dd textarea{
	font-size:14px;
	line-height: 20px;
	padding:20px 10px;
	width:100%;
	height:300px;
	border:none;
}
.information .contact .inner .text{
	font-size:14px;
	line-height:20px;
	color:#666666;
	text-align: center;
	margin-bottom:60px;
}
.information .contact .inner .text a{
	text-decoration: underline;
	color:#5587e7;
}
.information .contact .inner button{
	border-radius:4px;
	font-size:16px;
	line-height: 1;

	padding:22px 0;
	width:100%;
	max-width:400px;
	cursor: pointer;
	margin-bottom:40px;
	color: #44989e;
	border: 1px solid #44989e;
	background-color: #fff;
	display: block;
	margin:0 auto;
}
.information .contact .inner button:hover{
	background-color:#44989e;
	color:#ffffff;
}



.top{

	
}
#contents.top .contents-inner{
	width:100%;
	max-width:100vw;
}
.top .main-visual{
	background-color:#e9f4f5;
	
}
.top .main-visual .inner{
	max-width:960px;
	margin:0 auto;
	position:relative;
	padding:80px 0 70px 0;
}
.top .main-visual h1{
	font-size:28px;
	line-height:48px;
	color:#44989e;
	font-weight: bold;
	margin-bottom:20px;
	margin-left:70px;
}
.top .main-visual p{
	font-size:16px;
	line-height: 32px;
	color:#333333;
	margin-left:70px;
}
.top .main-visual .fig{
	position: absolute;
	top:80px;
	left:347px;
	
}
.top .main-visual .fig img{
	width:600px;
	height:auto;
	
}

.top .top-contentes{
	
}
.top .feature-box{
	
}
.top .feature-box .inner{
	max-width:689px;
	width:100%;
	position:relative;
	margin:0 auto;
	padding:130px 0;
}
.top .feature-box h2{
	font-size:24px;
	line-height:40px;
	color:#333333;
	font-weight: bold;
	text-align: center;
	margin-bottom:90px;
}
.top .feature-box .feature{
	position: relative;

}
.top .feature-box .feature .feature-inner{
	margin-bottom:140px;
}

.top .feature-box .feature h3{
	font-size:18px;
	line-height: 28px;
	color:#44989e;
	font-weight: bold;
	margin-bottom:20px;
}
.top .feature-box .feature p{
	font-size:16px;
	line-height: 28px;
	color:#666666;
}
.top .feature-box .feature img{
	width:375px;
	height:auto;
}

.top .feature-box .feature.feature1 .feature-inner{
	padding-right:374px;
}
.top .feature-box .feature.feature1 h3{
	
}
.top .feature-box .feature.feature1 p{
	
}
.top .feature-box .feature.feature1 img{
	position:absolute;
	top:0;
	right:-62px;
}


.top .feature-box .feature.feature2 .feature-inner{
	padding-left:374px;
	margin-bottom:180px;
}
.top .feature-box .feature.feature2 h3{
	
}
.top .feature-box .feature.feature2 p{
	
}
.top .feature-box .feature.feature2 img{
	position:absolute;
	top:0;
	left:-62px;


}
.top .feature-box a{
	font-size:20px;
	color:#ffffff;
	text-decoration: none;
	text-align: center;
	width:100%;
	max-width:400px;
	margin:0 auto;
	padding:40px 0;
	border-radius:3px;
	background-image:url("../images/top/arrow.png");
	background-position:right 30px center;
	background-repeat: no-repeat;
	background-size:12px auto;
	display: block;
	background-color: #44989e;
	border-radius:50px;
}
.top .feature-box a:hover{
	background-color:#55bdc4;
}

.top .flow-box{
	background-color:#f6f6f6;
}
.top .flow-box .inner{
	max-width:689px;
	width:100%;
	position:relative;
	margin:0 auto;
	padding:90px 0 50px 0;

}
.top .flow-box h2{
	font-size:20px;
	color:#44989e;
	font-weight: bold;
	position:absolute;
	top:-10px;
	left:-10px;
}
.top .flow-box ul{
	
}
.top .flow-box ul li.step{
	margin-right:30px;
	position: relative;
	display: inline-block;
	vertical-align: top;
}
.top .flow-box ul li.step:last-of-type{
	margin-right: 0;
}
.top .flow-box ul li.step:before{
	content:"";
	position: absolute;
	top:-30px;
	left:20px;
	width:44px;
	height:70px;
	background-repeat: no-repeat;
	background-size:44px auto;
	background-position: left top;

}
.top .flow-box ul li.step.step1:before{
	background-image:url("../images/top/step1.png");
}
.top .flow-box ul li.step.step2:before{
	background-image:url("../images/top/step2.png");
	
}
.top .flow-box ul li.step.step3:before{
	background-image:url("../images/top/step3.png");

}
.top .flow-box ul li.step p{
	font-size:16px;
	color:#666666;
	padding-left:80px;
	margin-bottom:10px;
}
.top .flow-box ul li.step .image{
	width:208px;
	height:208px;
	background-color:#ffffff;
}
.top .flow-box ul li.step .image img{
	width:208px;
	height:208px;
}


.top .info-box{
	
}
.top .info-box .inner{
	max-width:689px;
	width:100%;
	position:relative;
	margin:0 auto;
	padding:80px 0 70px 0;

}
.top .info-box h2{
	font-size:20px;
	color:#44989e;
	margin-bottom:40px;
}
.top .info-box h2 span{
	font-size:14px;
	display: inline-block;
	vertical-align: bottom;
	margin-left: 20px;
}
.top .info-box h2 span a{
	color:#666666;
	text-decoration: none;
	display: inline-block;
}
.top .info-box dl{
	margin-bottom:20px;
}
.top .info-box dl dt{
	font-size:14px;
	color:#999999;
	display:inline-block;
	vertical-align: top;
	width:130px;
}
.top .info-box dl dd{
	display:inline-block;
	vertical-align: top;
	width:calc(100% - 130px);
	
}
.top .info-box dl dd a{
	text-decoration: none;	
	color:#333333;
	font-size:14px;
	line-height: 20px;
}
.top .info-box dl dd a:hover{
	text-decoration: underline;
}

.top .comment-box{
	padding:80px 0;
	background-color:#e9f4f5;
}
.top .comment-box .inner{
	max-width:780px;
	width:100%;
	margin:0 auto;
	background-color:#ffffff;
	padding:36px;
}

.nodata{
	padding:60px 0 0 0;
	text-align: center;
}
.nodata .icon{
	text-align: center;
	margin-bottom:60px;
}
.nodata .icon img{
	display: block;
	margin:0 auto;
}
.nodata p{
	font-size:14px;
	line-height:24px;
	color:#333333;
	margin-bottom:0 !important;
}



/* ************************************************** */

@media(max-width:1160px){
	#contents .contents-inner{
		max-width:67.2413793vw;	/* 780px / 1160 */

	}

	#contents.top #article-list .inner article:first-of-type,
	#contents.top #article-list .inner article:nth-of-type(2){
		width: 32.3275862vw;	/*375 / 1160*/
	}
	#contents.top #article-list .inner article:first-of-type{
		margin-right: 2.58vw;	/*30 / 1160 */
	}


	aside{
		width:25.862069vw;	/*300px / 1160  */
		margin: 0 auto 0 3.44827586vw;	/* 0 auto 0 40px; / 1160  */
	}

	aside section.adbnr{
		margin-left:-3.44827586vw;
		width:calc(25.862069vw + 3.44827586vw);
		text-align:center;
	}
	aside section.adbnr ins{
		width:calc(25.862069vw + 3.44827586vw) !important;
	}
	aside section.adbnr iframe{
		width:100% !important;
	}
	aside section.adbnr iframe img{
		/*width:100%;*/
	}

	#pickup .inner {
		max-width: 738px;
	}
	#pickup .inner article:nth-of-type(2) {
		margin-right: 0;
	}

	footer .box{
		margin: 0 80px 0 30px;
		max-width: 860px;
	}

	#returntop .inner .seq{
		right: 30px;
	}

}



@media(max-width:1024px){
	header{
		padding: 0 15px;
	}

	footer .box {
		max-width: 640px;
		position: relative;
	}
	footer .box #about {
		padding: 0 30px 0 0;
	}
	footer .box #foot-menu {
		width: 240px;
	}
	footer .box #foot-menu .menu-inner ul:last-of-type {
		padding: 0 10px 0 0;
	}


	footer .box #foot-menu .sns{
		position: absolute;
		left: 30px;
		bottom: 80px;
	}
	footer .box #copy{
		margin-top: 90px;
	}

}





@media(max-width:959px) {
	#contents .contents-inner{
		max-width:780px;
	}
	#contents.top #article-list .inner article:first-of-type,
	#contents.top #article-list .inner article:nth-of-type(2){
		width: 375px;
	}
	#contents.top #article-list .inner article:first-of-type{
		margin-right: 30px;
	}
	#contents.page aside {
		margin-top: 0;
	}
	aside {
		margin: 20px auto 0 auto;
		max-width: 780px;
		width: 100%;
		text-align: center;
	}
	aside section.adbnr {
		text-align: center;
		margin: 0 auto;
		width:300px !important;
	}
	aside section.adbnr ins{
		width:300px !important;
	}
	aside section.adbnr img{
		/*max-width:300px;*/
	}
	aside .inner section.side-article {
		width: 300px;
		display: inline-block;
		vertical-align: top;
		margin-right: 30px;
	}
	aside .inner section.side-article:nth-child(even) {
		margin-right: 0;
	}
	aside .inner section.side-article:nth-child(odd):last-child {
		margin-right: 0;
	}


}


@media(max-width:820px) {
	/* tab mode */

	#slider {
		padding: 0 20px 30px 20px;
	}
	#slider article .title {
		padding: 0 35px;
	}
	.swiper-button-next, .swiper-button-prev {
		width: 30px;
		height: 60px;
	}
	.swiper-button-prev {
		left: 0;
	}
	.swiper-button-next {
		right: 0;
	}
	.swiper-button-next img, .swiper-button-prev img {
		width: 22px;
		margin: 19px 4px;
	}
	#main {
		overflow-x: hidden;

	}
	#contents {

	}
	#contents .contents-inner {

		width: 690px;
	}
	#article-list article {
		width: 100%;
	}
	#article-list article .title {
		font-size: 20px;
		line-height: 24px;
		max-height: 86px;
		margin-bottom: 10px;
	}


	#contents.top #article-list .inner article:first-of-type, #contents.top #article-list .inner article:nth-of-type(2) {
		width: 330px;
	}
	#contents.top #article-list .inner article:first-of-type .title, #contents.top #article-list .inner article:nth-of-type(2) .title {
		font-size: 18px;
		line-height: 24px;
		max-height: 82px;
		height: 82px;
		padding: 10px 15px;
	}
	#contents.top #article-list .inner article:first-of-type .lead, #contents.top #article-list .inner article:nth-of-type(2) .lead {
		font-size: 12px;
		line-height: 18px;
		max-height: 48px;
		height: 48px;
		padding: 10px 15px 8px 15px;
	}
	#contents.top #article-list .inner article:first-of-type .label, #contents.top #article-list .inner article:nth-of-type(2) .label {
		position: absolute;
		top: inherit;
		bottom: 194px;	/*148px;*/
		left: 0;
		padding: 6px;
	}
	aside section.adbnr {
		max-width: 300px;
		display: block;
		margin: 0 auto 30px auto;
	}
	aside section.adbnr img {
		width: 100%;
	}
	aside .inner {
		width: 690px;
		margin: 0 auto;
		font-size: 0;
	}
	aside .inner section.side-article {
		display: inline-block;
		margin: 0 30px 30px 0;
		width: 330px;
	}
	aside .inner section.side-article:eth-child(even) {
		margin: 0 0 30px 0;
	}
	aside .inner section.side-article:nth-child(2n+1):last-child {
		margin: 0 auto 30px auto;
	}
	aside section.side-article .inner {
		width: 290px;
	}
	aside #tagcloud {
		width: 100%;
	}
	#pickup {
		padding: 30px 20px 40px 20px;
		margin: 0 auto;
	}
	#pickup .head {
		font-size: 24px;
		padding-bottom: 20px;
	}
	#pickup .inner {
		max-width: 760px;
		width: auto;
	}
	#pickup .inner article {
		width: 100%;
		margin: 0 auto;
	}
	#pickup .inner article {
		width: calc((100% - 40px)/ 3);
		margin-right: 20px;
		padding-bottom: 25px;
	}
	#pickup .inner article:nth-of-type(2) {
		margin-right: 20px;
	}
	#pickup .inner article:last-of-type {
		margin-right: 0;
	}
	#pickup .inner article .title {
		font-size: 18px;
		line-height: 24px;
		max-height: 82px;
		height: 82px;
		padding: 10px 15px;
		overflow: hidden;
	}
	#pickup .inner article .lead {
		font-size: 12px;
		line-height: 18px;
		max-height: 48px;
		height: 48px;
		padding: 10px 15px 8px 15px;
		overflow: hidden;
	}
	#pickup .inner article .label {
		position: absolute;
		top: inherit;
		bottom: 148px;
		left: 0;
		padding: 6px;
	}
	#pickup .inner article:last-of-type .label {
		/*bottom:123px;*/
	}
	footer .box {
		max-width: 615px;
	}
	footer .box #foot-menu {
		width: 220px;
	}
	footer .box #foot-menu .menu-inner ul {
		padding: 0 50px 0 0
	}

	#contents.page {
		margin-top: 0;
		padding: 0;
	}
	#contents.page .contents-inner, #contents.page aside {
		margin-top: 0;
		width: 100%;
		max-width: 100%;
	}
	.page-detail {
		padding: 50px 40px;
		margin: 30px auto 0 auto;
		width: calc(100% - 40px);
	}
	#contents.page .keyvisual, #contents.page .maintitle, #contents.page .pagenavi {
		background-color: #ffffff;
	}
	#contents.page .keyvisual {
		padding-bottom: 15px;
	}
	#contents.page .keyvisual .label {
		bottom: 15px;
	}
	#contents.page .maintitle {
		padding: 0 20px 18px 20px;
		line-height: 30px;
		height: auto;
		margin-bottom: 0;
	}
	#contents.page .date{
		padding-right:20px;
		padding-bottom:0;
	}
	#contents.page .pagenavi {
		padding: 0 20px 20px 20px;
	}
	#contents.page .pagenavi .like-follow, #contents.page .pagenavi .sns {
		margin: 30px auto 15px auto;
	}
	#contents.page .pagenavi .like-follow ul li {
		margin-right: 16px;
	}
	#contents.page .pagenavi .like-follow {
		margin-right: 16px;
		padding-right: 16px;
	}
	#contents.page .pagenavi .sns ul li {
		padding-right: 16px;
	}
	#contents.page .pagenavi .tags {
		width: 100%;
		max-width:100%;
		float: none;
		border-top:1px solid #cccccc;
		padding-top: 15px;
	}
	.page-body p {
		font-size: 14px;
		line-height: 25px;
		margin-bottom: 20px;
	}
	.page-body h3 {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 20px;
	}
	.page-body a.otherlink {
		border: 1px solid #3d76f5;
		width: 200px;
		padding: 14px 0;
		border-radius: 23px;
		margin: 25px auto 0 auto;
		display: block;
		text-align: center;
	}
	.page-body .writer {
		padding-top: 30px;
		margin-top: 30px;
	}
	/*
	.page-body .writer .fig {
		display: block;
		margin: 0 auto 20px auto;
	}
	.page-body .writer .text{
		width: 100%;
		padding-left:0;
		display: block;
	}
	*/
	.comment-body {
		padding: 20px 15px 15px 15px;
	}
	.comment-body .fig {
		width: 20px;
	}
	.comment-body .text {
		width: calc(100% - 20px);
		padding-left: 20px;
	}

	.comment-body ul li {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	.comment-body .gologin:before {
		top: -140px;
	}
}


@media(max-width:768px){
	footer .box{
		position: relative;
	}

	footer .box #foot-menu .sns{
		position: absolute;
		left: 30px;
		bottom: 90px;
	}
	footer .box #copy{
		margin-top: 90px;
	}



	
}



@media(max-width:767px) {
	/* tab mode */
	body {

	}
	header {
		position: relative;
	}

	header #menu-btn {
		height: 24px;
		width:24px;
		position: absolute;
		right:24px;
		top:16px;
		z-index:2;
	}
	header #menu-btn span{
		display: block;
		position: absolute;
		height: 2px;
		width:24px;
		background-color:#44989e;
		border-radius:2px;
		display: inline-block;
		position:absolute;
		transition-duration:.5s;
	}
	header #menu-btn span:nth-of-type(1){
		top:6px;
		left:0;
	}
	header #menu-btn span:nth-of-type(2){
		top:11px;
		left:0;
	}
	header #menu-btn span:nth-of-type(3){
		top:16px;
		left:0;
	}
	header #menu-btn.open span:nth-of-type(1){
		top:11px;
		left:2px;
		transform:rotate(45deg);
		background-color:#ffffff;
	}
	header #menu-btn.open span:nth-of-type(2){
		opacity:0;
	}
	header #menu-btn.open span:nth-of-type(3){
		top:11px;
		left:2px;
		transform:rotate(-45deg);
		background-color:#ffffff;
	}




	header .avator{
		top:27px;
		right:50px;
	}

	header h1{
		margin-right: 0;
	}

	header h1 img {
		width: 110px;
	}
	header .head-menu{
		width: calc(100% - 110px );
	}

	header .menu-box .menu a{
		font-size:12px;
	}
	header .menu-box .menu.login a{
		background-size:13px auto;
		padding-left:19px;
	}
	header .menu-box .menu.register{
		margin-right:65px;
		margin-left: 15px;
		padding-left: 15px;
	}
	header .menu-box .menu.tag{
		display: none;
	}
	header .menu-box .menu.sitelist{
		display: none;
	}
	header .menu-box .menu.logout{
		margin-right:50px;
		margin-left: 0;
		padding-left: 0;
	}
	header .menu-box .menu.logout a{
		background-size: 13px auto;
		margin-left: 15px;
		padding: 3px 0 3px 35px;
		background-position: left 15px center;
	}

	header #sp-menu{
		display: none;
		height: 0;
		transition-duration: 1s;
		transition-property:height,padding;
		position: absolute;
		background-color:#44989e;
		cursor: pointer;
	}
	header #sp-menu.open{
		display: block;
		height: auto;
		width: 100%;
		top: 0;
		left: 0;
		z-index:1;
		padding:110px 0 100px 0;
		text-align: center;
	}

	header .menu-box #sp-menu .logo{
		position: absolute;
		top: 0;
		left: 0;
	}
	header .menu-box #sp-menu .logo img{
		width: 110px;
		position: absolute;
		top: 15px;
		left: 15px;
	}


	header .menu-box #sp-menu .menu.register{
		margin-right:0;
	}

	header .menu-box #sp-menu .menu.tag,
	header .menu-box #sp-menu .menu.sitelist,
	header .menu-box #sp-menu .menu.mypage,
	header .menu-box #sp-menu .menu.logout
	{
		display: block;
		margin:0 auto;
		padding:10px 0;
	}
	header .menu-box #sp-menu .menu a{
		font-size:14px;
		color:#ffffff;
	}
	header .menu-box #sp-menu .menu.logout{

	}
	header .menu-box #sp-menu .menu.login a{
		background-image:url("../images/common/icon_login_b.png");
	}
	header .menu-box #sp-menu .menu.logout a{
		background-image:url("../images/common/icon_logout_b.png");
		border-left:none;
		margin-left:0;
		background-position:left center;
		padding:3px 0 3px 24px;
	}



	
	#spnavi {
		display: block;
		width: auto;
		z-index: 10;
		background-color: #ffffff;
		overflow: hidden;

	}
	#spnavi.fixed {
		height: 52px;
	}
	#spnavi .navi-inner {
		width: max-content;
		min-width: 100%;
		overflow-x: scroll;
		background-color: #bbbbbb;
		padding: 0 8px;
		width: 100%;
		background-image:url("../images/common/menu-border.png");
		background-position: left bottom;
		background-size: 100% 1px;
		background-repeat: no-repeat;
		padding-bottom:1px;
	}
	#spnavi.fixed .navi-inner {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100;
	}
	#spnavi .navi-inner .mask {
		height: 52px;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		/* 慣性スクロール */
	}
	#spnavi .navi-inner ul {
		display: inline-table;
		table-layout: fixed;
		width: 672px;
	}
	#spnavi .navi-inner ul li {
		/*display: inline-block;*/
		display: table-cell;
		table-layout: fixed;
		vertical-align: bottom;
		width: 112px;
		height: 42px;
	}
	#spnavi .navi-inner ul li:last-of-type {
		margin-right: 0;
	}
	#spnavi .navi-inner ul li a {
		height: 42px;
		color: #000000;
		text-decoration: none;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #ffffff;
		border-radius: 5px 5px 0 0;
		font-size: 13px;
		line-height: 16px;
		margin-right: 10px;
		margin-top: 10px;
		text-align: center;
	}
	#spnavi .navi-inner ul li a.current, #spnavi .navi-inner ul li a:hover {
		background-color: #2c87fb;
		color: #ffffff;
		text-decoration: none;
	}

	#main{
		margin-top: 0;
	}
	#slider {
		padding: 0 0 30px 0;
	}
	#navi {
		display: none;
	}
	#contents {
		padding: 0;
	}
	#contents .contents-inner {
		width: 100%;
	}
	#article-list article .fig {
		width: 110px;
	}
	#article-list article .title {
		width: calc(100% - 110px);
		padding: 10px 15px;
		font-size: 14px;
		line-height: 18px;
		max-height: 62px;
	}
	#article-list article .lead {
		width: 100%;
		float: none;
		font-size: 11px;
		line-height: 15px;
		padding: 15px 15px;
		max-height: 45px;
		margin-top:2px;
	}
	#article-list article .date{
		font-size:11px;
	}
	#article-list article .label {
		position: static;
		padding: 0 15px 15px 15px;
		font-size: 11px;
		padding: 18px 15px 8px 15px;
	}
	#contents.top #article-list .inner article:first-of-type, #contents.top #article-list .inner article:nth-of-type(2) {
		width: 100%;
	}
	aside .inner {
		width: auto;
		max-width: 100%;
	}
	aside .inner section.side-article {
		display: block;
		margin: 0 auto 30px auto;
		width: 100%;
		max-width: 100%;
	}
	
	aside .inner section.side-article:nth-child(even) {
		display: block;
		margin: 0 auto 30px auto;
	}
	aside .inner section.side-article:nth-child(odd):last-child {
		display: block;
		margin: 0 auto 30px auto;
	}
	aside section.side-article .inner {
		width: 100%;
	}


	#pickup .inner article {
		width: 100%;
	}
	footer {
		padding: 35px 37.5px 23px 37.5px;
	}


	footer ul li{
		margin-bottom:0;	
		font-size:12px;
		margin-right:0;
		margin-left:0;
		width:50%;
	}
	footer ul li:nth-of-type(1),
	footer ul li:nth-of-type(2){
		margin-bottom:20px;
	}
	footer .logo img{
		width:110px;
	}
	footer .copyright{
		font-size:10px;
	}



	#returntop{
		top:0;
		left:0;
	}
	#returntop .inner .seq{
		width:45px;
		height:45px;
		right:unset;
		left: calc(50% - 22.5px);
	}
	.page-detail {
		padding: 25px 20px;
		width: 100%;
		margin:25px auto 0 auto;
	}

	.listtitle{
		margin: -20px auto 20px -20px;
		font-size: 26px;
		padding:18px 0;
		background-color: #fff;
		width: 100vw;
	}

	#article-list .inner a.more{
		margin: 20px auto 0 auto;
	}

	.information .info-box{
		margin-top: 0;
		background-color:unset;
		padding:  0;
		
	}


	
	.information .info-box h2{
		font-size:20px;
		margin-bottom:20px;
		padding:24px 0;

		width: 100vw;
		margin-left: 0;
	}
	.information .info-box .inner{

		width: 100vw;
		margin-left: 0;
		padding:0 20px 0 20px;
	}



	#contents.information .contents-inner{
		padding: 40px 0 50px 0;
	}

	.information .contact .inner p{
		line-height:1.4;
	}

	.information .info-box .lead{
		width:100%;
		text-align: left;
	}
	.information .info-box .lead br{
		display: none;
	}

	.information .about .text{
		margin-bottom: 30px;
	}

	.information .about dl{
		width:100%;
	}
	.information .about dl dt{
		width: 50px;
		height: 50px;
		font-size:30px;
	}
	.information .about dl dd{
		width: calc(100% - 50px);
	}


	.information .about .company{
		padding-top: 70px;
	}
	.information .about .company .inner{
		width:100%;
		margin: 0 auto;
	}
	.information .about .company .inner dt{
		width:95px;
		padding:10px 0;
	}
	.information .about .company .inner dd{
		width:calc(100% - 95px);
	}


	.information .contact dl dt{
		width:100%;
	}
	.information .contact dl dd{
		width:100%;
	}


	h2.pub-h2{
		padding: 30px 0;
	}
	

	#contents.member .pub-title.pub-title2{
		line-height:1.4;
	}


	#contents.member .pub-choice a{
		margin-right:0;
		margin-bottom: 10px;
	}

	#contents.member #mypage h2{
		text-align: center;
		margin-bottom:20px;
	}
	#contents.member #mypage .avator{
		margin:0 auto 40px auto;
	}
	#contents.member #mypage .bg{
		padding-bottom:0;
	}
	#contents.member #mypage .sns{
		margin-bottom:0;
	}

	#contents.member #mypage{
		padding: 60px 0 50px 0;
	}




	.list .page-body .writer{
		margin-top:0;
		width: calc(100vw - 40px);
		margin-left: 0;
		padding: 20px;
	}
	.page-body .writer .text h4{
		margin-top: 15px;
	}
	.mypage .page-body .writer .setting{
		margin-right: -20px;
	}
		
	.page-body .writer .text p{
		width: calc(100vw - 40px);
		margin-left: -60px;
		margin-top: 5px;
	}

	.top .main-visual .inner{
		padding:30px 15px;
		margin:0 auto;
		max-width:375px;
	}

	.top .main-visual h1{
		font-size:22px;
		line-height:30px;
		margin-left:0;
		margin-bottom:16px;
	}
	.top .main-visual p{
		font-size:13px;
		line-height:21px;
		margin-left:0;
	}
	.top .main-visual .fig{
		top:96px;
		left:192px;
	}
	.top .main-visual .fig img{
		width:auto;
		height:172px;
	}


	.top .feature-box .inner{
		padding:90px 37.5px 85px 37.5px;
	}
	.top .feature-box h2{
		font-size:20px;
		line-height:32px;
		margin-bottom:44px;
	}
	.top .feature-box .feature .feature-inner{
		margin-bottom:16px;
	}
	.top .feature-box .feature.feature1 .feature-inner{
		padding-right:0;
	}
	.top .feature-box .feature.feature2 .feature-inner{
		padding-left:0;
		margin-bottom: 16px;
	}
	
	.top .feature-box .feature.feature1 img{
		position:static;
		max-width:230px;
		display: block;
		margin:0 auto 46px auto;
	}
	.top .feature-box .feature.feature2 img{
		position:static;
		max-width:230px;
		display: block;
		margin:0 auto 50px auto;
		
	}
	.top .feature-box .feature h3{
		font-size:14px;
		line-height: 20px;
		margin-bottom:12px;
	}

	.top .feature-box .feature p{
		font-size:12px;
		line-height:18px;
	}
	.top .feature-box a{
		font-size:15px;
		padding:30px 0;
		border-radius:37.5px;
		max-width:295px;
		background-position:right 23px center;
		background-size:8px auto;
	}
	.top .flow-box h2{
		width: 100%;
		font-size:20px;
		top:-10px;
		left:0;
		text-align: center;
	}
	.top .flow-box .inner{
		padding:60px 0 40px 0;
	}
	.top .flow-box ul{
		text-align:center;
	}
	.top .flow-box ul li.step{
		margin-right:0;
		padding-bottom: 40px;
		/*margin-bottom: 20px;*/
		max-width: 208px;
		margin: 0 auto 20px auto;
		display: block;
	}
	.top .flow-box ul li.step:last-of-type{
		padding-bottom:0;
		/*margin-bottom:0;*/
		margin:0 auto;

	}

	.top .info-box .inner{
		padding:75px 15px 50px 15px;
	}
	.top .info-box dl{
		margin-bottom:20px;
	}
	.top .info-box dl dt{
		width:100%;
		margin-bottom:10px;
	}
	.top .info-box dl dd{
		width:100%;
	}

	.top .comment-box{
		padding:30px 20px;
	}
	.top .comment-box .inner{
		padding:18px;
	}
	.top .page-detail{
		margin:0 auto;
		padding:0;
	}

	#contents.mypage .contents-inner{
		/*padding:0 15px 75px 15px;*/
		padding: 0 0 50px 0;
	}
	#contents.member.mypage #mypage{
		padding:0 15px;
	}

	.page-body .writer .fig{
		width:40px;
		height:40px;
		border-radius:20px;
	}
	.page-body .writer .text{
		width: calc(100% - 40px);
		padding-left: 10px;
	}

	.mypage .profnavi{
		margin-bottom: 60px;
	}
	.mypage ul.countstatus{
		position:relative;
	}
	.mypage .profnavi ul.countstatus li.goodcnt{
		position:absolute;
		top: 63px;
		left: 0;
		width: 100%;
		text-align: center;
		float: none;
		margin-left: 0;
	}

	#contents.member .commentlist .inner ul li{
		padding: 15px 0;
		border-bottom:none;
	}

	#contents.member .commentlist .inner ul li div{
		width:100%;
		margin-bottom:15px;
	}
	#contents.member .commentlist .inner ul li div span{
		margin-bottom:8px;
		font-size:10px;
	}
	#contents.member .commentlist .inner ul li a{
		width:100%;
	}

	
	#contents.member .comment-body{
		padding: 20px 0 15px 0;
	}

	#contents.member #login{
		padding: 20px 20px 50px 20px;
	}

	#contents.member #news{
		padding: 0 0 50px 0;
	}
	#contents.member .news-titlebox{
		padding: 25px 0;
	}
	#contents.member #news .news.news-content{
		margin-bottom: 50px;
	}
	#contents.member #news .news{
		margin:0 20px;
	}

	.nodata{
		padding:0;
	}

}


@media(max-width:730px){
	#article-list article.infeed-ad{
		display: none;
	}
}

@media(max-width:640px){

	#contents.member #mypage .bg{
		padding-right:20px;
		padding-left:20px;
	}
	#contents.member #mypage .profile dl dt{
		width:100%;
		padding: 22px 0 0 0;
	}
	#contents.member #mypage .profile dl dd{
		width:100%;
	}

	.comment .commentpost{
		padding: 30px 10px;
	}

	.comment-body .text.addcomment{
		width:100%;
		padding-left:0;
	}


	.comment-body .text .likefollow{
		margin-top: 0px;
	}
	.comment-body .text p.commentdata{
		padding-top: 20px;
	}

	.comment-body .text button,
	.comment-body .text button.reform{
		margin: 30px auto 0 auto;
		display: block;
	}

	#contents.member .pub-title{
		line-height:1.4;
	}


}






@media(max-width:619px){
	#contents.member #mypage .listdata{
		width:100%;
		margin-right:0;
	}
	#contents.member #mypage .listdata.follow{
		margin-bottom:60px;
	}

	#contents.member #mypage .sns ul li span{
		width:calc(100% - 40px - 30px - 160px - 30px);
	}


}


@media(max-width:480px){
	#contents.page .pagenavi .like-follow{
		border-right:none;
		margin-right:0;
	}
	#contents.page .pagenavi .like-follow ul li:first-of-type{
		display: block;
		padding-bottom: 16px;
	}
	#contents.page .pagenavi .sns{
		border-left:1px solid #ccc;
		vertical-align: bottom;
		padding-left:16px;
		margin-left:0;
	}


	#contents.member #mypage .sns ul li .icon{
		width:30px;
		margin-right:20px;
	}
	#contents.member #mypage .sns ul li .icon img{
		width:30px;		
	}
	#contents.member #mypage .sns ul li span{
		width:calc(100% - 30px - 20px - 120px - 20px);
		font-size:12px;
	}
	#contents.member #mypage .sns ul li .setting{
		width:120px;
		margin-left:20px;

	}
	#contents.member #mypage .sns ul li .setting.active{
		background-position: left 10px center;

	}

}


@media(max-width:374px) {
	header .avator{
		display: none;
	}
	header .menu-box .menu a{
		font-size:8px;
	}
	header .menu-box .menu.logout{
		margin-right: 40px;
	}

	footer .box #foot-menu .menu-inner ul li {
		font-size: 14px;
	}

	footer .box #foot-menu .sns ul.rule li{
		width:100%;
		text-align:center;
		margin:0 auto 20px auto;
	}
	footer .box #foot-menu .sns ul.rule li:last-of-type{
		margin:0 auto;
	}

	.pager a{
		width: 30px;
		padding: 7px 0;
	}
	
	.pager a.prev {
		height: 30px;
	}
	
	.pager a.next {
		height: 30px;
	}

	.mypage ul.countstatus li.likes{
		background-size: 10px auto;
		padding-left: 16px;
	}
	.mypage .profnavi ul.countstatus li{
		margin-left: 8px;
	}
	.mypage ul.countstatus li .cnt{
		font-size: 12px;
	}
	.mypage ul.countstatus li .label{
		font-size: 11px;
	}
	.mypage #article-list article .label .countstatus li.likes .cnt{
		font-size:12px;
	}

	.information .info-box .list li{
		margin: 0px 2px;
	}
}


@media(max-width:330px){
	aside section.adbnr{
		margin-left:-10px;
	}
}

/* ************************************************** */



.nologin #menu .logout,
.nologin #foot-menu .logout{
		display: none;
}
.nologin #menu .mypage,
.nologin #foot-menu .mypage{
	display: none;
}

.login #menu .signup,
.login #foot-menu .signup{
	display: none;
}
.login #menu .login,
.login #foot-menu .login{
	display: none;
}





/* ************************************************** */

#modal-bg{
	display:none;
	width:100%;
	height:100%;
	background-color: rgba(0,0,0,0.7);
	position:fixed;
	top:0;
	left:0;
	z-index: 10000;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	-ms-flex-line-pack: center;
	justify-content: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	flex-direction: column;
}
#modal-main {
	margin: 0;
	padding: 0;



	z-index: 100;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	flex-direction: column;

}
#modal-main .inner{
	padding: 15px;
	color: #999999;
	background-color:#ffffff;
	/*width: calc(100% - 30px);*/
	width: calc(100% - 140px);
	min-width:233px;
	margin:0 auto;
	border-radius:6px;
}
#modal-main .inner.small{
	width:235px;
}
#modal-main .title{
	font-size:14px;
	font-weight: normal;
	line-height: 20px;
	color:#999999;
	text-align:center;
}


#modal-main img{
	width:100%;
	height:auto;
	padding:20px 0 15px 0;
}
#modal-main .description{
	font-size:14px;
	color:#333333;
	padding:20px 0 0;
	text-align:center;
}
#modal-main .description p{
	text-align: left;
	line-height:1.4;
	margin-bottom:20px;
}
#modal-main .description a{
	text-decoration: underline;
	color:#333333;
}

/* モーダル閉じる */
#modal-main .close{
	padding: 14px 0;
	margin:30px 15px 0 15px;
	font-size:12px;
	border-radius: 20px;
	width: calc(100% - 30px);
	color:#ffffff;
	background-color:#999;
	text-align: center;
	cursor: pointer;

}
#modal-main .close:active{
	background-color:#eeeeee;
}

#modal-inner{
	margin:0 auto;
	max-width:345px;
}