@charset "utf-8";

/* ----- reset ----- */

* {
	margin: 0;
	padding: 0;
	border: none;
	text-decoration: none;
	list-style: none;
	vertical-align: baseline;
	background: transparent;
	outline: none;
	box-sizing: border-box;
}
html, body {
	font: normal 100% 'Trebuchet MS',YuGothic,'Yu Gothic','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
	font-size: 14px;
	height: 100%;
	padding:0;
	margin:0;
	-webkit-text-size-adjust: none;/* 縦横の文字の自動調整 */
}
.flex {
	display: flex;
	-js-display: flex;
	flex-wrap: wrap;
}
a {
	color: #337ab7;
	text-decoration: none;
	transition: .4s color ease-in-out;
}
p {
	line-height: 2;
	letter-spacing: 1px;
	font-size: 12px;
}
strong {
	color: #E40981;
	border-bottom: #E40981 1px dotted;
}

/* ----- headeding ----- */
h1 {
	width: 210px;
	height: 100px;
	background: url(image/deliheruheader.png) center center no-repeat;
	overflow: hidden;
	font-size: 10px;
}
h1 a {
	display: block;
	line-height: 210px;
}
h2 {
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 2;
}
h2 a {
	color: #000 !important;
}

/* ----- table ----- */
table {
	width: 100%;
	table-layout: fixed;
	margin-bottom: 25px;
}
table td, table th {
	width: 20%;
	padding: 10px 0;
	font-weight: normal;
	vertical-align: middle;
}
table a {
	display: block;
}
table img {
	width: auto;
	max-width: auto;
	display: block;
	border: 1px solid #EBEBEB;
	margin: 0 auto;
}

/* ----- pageall ----- */

#pageall {
	width: 910px;
	height: 100%;
	margin: 0 auto;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	background: url(image/back.gif) right top no-repeat;
	background-size: 40%;
}

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

#header {
	width: 100%;
	flex-direction: row;
	border-bottom: 1px dotted #E40981;
	padding: 0 0 10px 0;
	margin-bottom: 15px;
}
#header p {
	width: calc(100% - 210px);
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	color: #663300;
	padding: 10px 10px 0 0;
}

#header + p {
	width: 100%;
	padding: 0 0 10px 0;
}

/* ----- main ----- */

#main {
	width: 600px;
}
#main h2{
	border-left: 5px solid #E40981;
	padding-left: 15px;
	margin-bottom: 10px;
}
#main h2 span{
	display: block;
	color: #E40981;
	border-top: #E40981 1px dotted;
	font-size: 10px;
	font-weight: normal;
	text-align: right;
	line-height: normal;
	margin-top: 5px;
	padding-top: 5px;
}
#main p, #navi p {
	padding: 10px;
}
.answer {
	background: #F4FDFF;
	border: 1px solid #0080FF;
	padding: 10px;
	margin-bottom: 25px;
}
#main .answer h2 {
	border-left: #0080FF 5px solid;
}
#main .answer span {
	border-top: #0080FF 1px dotted;
	color: #0080FF;
}
.answer + ul {
	text-align: right;
	margin-bottom: 25px;
}
.answer + ul li {
	font-weight: bold;
}

/* ----- h2 ----- */

#biginner, #play, #seibyo, #renai, #etc {
	border-bottom: none;
	padding-left: 35px !important;
}
#biginner {
	background:url(image/syosinsya.gif) 10px center no-repeat;
}
#play {
	background:url(image/male.gif) 10px center no-repeat;
}
#seibyo {
	background:url(image/pill.gif) 10px center no-repeat;
}
#renai {
	background:url(image/personals.gif) 10px center no-repeat;
}
#etc {
	background: url(image/sonota.gif) 10px center no-repeat;
}


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

#navi {
	width: 290px;
}
#navi h2 {
	font-size: 14px;
	border-bottom: #E40981 1px dotted;
	height: inherit;
	margin: 0px;
	border-left: #E40981 5px solid;
	padding-left: 10px;
}
#navi h2 span{
	font-size: 10px;
	font-weight: normal;
}
#navi ul, #navi p {
	margin-bottom: 25px;
}
#navi li a, #link li a {
	padding: 10px 0 10px 25px;
	position: relative;
	display: block;
}
#navi li a:hover, #link li a:hover {
	color: #e40981;
}
#navi li a:before, #link li a:before, #update li:before {
	content: '';
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-left: 8px solid #e40981;
	border-bottom: 5px solid transparent;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 5px;
	margin: auto;
}
#navi li a img {
	display: block;
	border: none;
}

/* ----- update ----- */

#update {
	height: 100px;
	border: #E40981 1px dotted;
	overflow: auto;
	margin-bottom: 25px;
}
#update h2 {
	background:url(image/upback.gif) top right no-repeat;
	background-size: 100%;
	color: #fff;
	border-left: none;
	padding: 0 0 0 10px;
	margin: 0px;
}
#update ul {
	padding: 10px 15px;
}
#update li {
	padding: 5px 15px 5px 25px;
	text-align: left;
	position: relative;
}

/* ----- link ----- */

#link {
	margin-top: 25px;
}
#link h2 {
	background: url(image/backh2.gif) repeat-x;
	margin-bottom: 15px;
	color: #fff;
	text-align: center;
}
#link ul {
	display: flex;
	-js-display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: flex-start;
}
#link li {
	width: calc(100% / 3);
}
#link p {
	text-align: center;
	padding: 10px 0;
	margin: 15px 0 0 0;
}

/* ----- archive ----- */

#archive {
	margin: 0 0 25px 0;
}
#archive table {
	width: 100%;
	margin: 0 0 15px 0;
	border: 1px solid #999999;
	border-collapse: collapse;
}
#archive table th {
	width: 75%;
	padding: 5px 10px;
	border: 1px solid #999999;
	font-weight: normal;
	text-align: left;
}
#archive table th:hover {
	background: #f4f4f4;
}
#archive table tr#cap {
	font-weight: bold;
	background: #F2F2F2;
}
#archive table tr#cap th {
	font-weight: bold;
}
#archive table td {
	border: 1px solid #999999;
	padding: 5px 10px;
	font-weight: bold;
}
#archive table tr#cap th:not(:first-child), #archive table tr td:not(:first-child) {
	text-align: center;
}
#archive table tr td:nth-child(2) {
	width: 10%;
}
#archive table tr td:nth-child(3) {
	width: 15%;
}
#archive ul {
	width: 100%;
	display: flex;
	-js-display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
}
#archive ul li {
	width: 50%;
}
#archive ul li a {
	display: block;
	color: #666666;
}
#archive ul li:first-child a {
	text-align: left;
}
#archive ul li:nth-child(2) a {
	text-align: right;
}

/* ----- bot_pick ----- */

#bot_pick {
	border: 1px solid #FFCC00;
	}
#bot_pick p, #bot_pick02 p {
	font-weight: bold;
	padding: 20px;
}
#bot_pick h2 {
	background: url(image/pickh2.gif) center no-repeat;
	background-size: cover;
	border: none;
	margin: 0;
}
#bot_pick h2 span {
	display: inline;
	border-top: none;
}
#bot_pick a {
	font-size: 16px;
	font-weight: bold;
}
#bot_pick a:last-child {
	color: #e40a38;
	border-bottom: 1px dotted #e40a38;
}

#bot_pick02 h2 {
	background: url(image/backh2.gif) center no-repeat;
	padding: 10px;
	margin-top: 0px;
	color: #fff;
}
#bot_pick02 a {
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	color: #0033FF;
}
#bot_pick02 {
	border: #FF0066 1px solid;
}

/* ----- ol ----- */

#main ol {
	margin-bottom: 25px;
	padding: 10px;
}
#info ol {
	background: #FFF0FC;
	border: 1px solid #E40981;
}
#kaitou ol, #main ol {
	background: #F4FDFF;
	border: 1px solid #0080FF;
}
#main ol li {
	padding: 5px 0 5px 15px;
	position: relative;
}
#info ol li:not(:last-child) {
	border-bottom: 1px dotted #E40981;
	margin-bottom: 10px;
}
#main ol li:not(:last-child), #kaitou ol li:not(:last-child) {
	border-bottom: 1px dotted #0080FF;
	margin-bottom: 10px;
}
#main ol li:before {
	content: '';
	width: 4px;
	height: 4px;
	border-radius: 100%;
	border: 1px solid #000;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}

/* ----- h_navi ----- */
#h_navi {
	width: 100%;
}
#h_navi ol {
	color: E40981;
	margin-bottom: 15px;
	display: flex;
	-js-display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: flex-start;
}
#h_navi ol li:not(:last-child) {
	margin-right: 5px;
}
#h_navi ol li a {
	color: E40981;
}

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

#fom {
	margin-bottom: 25px;
	padding: 0 10px;
}
#fom .message {
	font-size: 12px;
	margin-bottom: 15px;
}
form {
	margin-bottom: 15px;
}
form div {
	margin-bottom: 15px;
}
form div:nth-child(7) {
	margin: 0 !important;
}
input[type="text"], textarea {
	border: 1px solid #c1c1c1;
	padding: .5rem;
}
input[type="text"] {
	width: 40%;
}
textarea {
	width: 100%;
	resize: vertical;
}
input[type="button"] {
	width: 100px;
	height: 30px;
	line-height: 30px;
	border: 1px solid #c1c1c1;
	background: #f4f4f4;
	cursor: pointer;
}

/* ----- sougoinfo ----- */
#info h2 {
	background: url(image/backh2.gif) left center;
	background-size: cover;
	border: none;
	color: #fff;
}
#kaitou ul.flex {
	width: 100%;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	margin: 0 10px;
}
#kaitou ul.flex:last-child {
	margin-bottom: 10px;
}

#kaitou ul.flex li {
	width: calc(100% / 3);
	margin-bottom: 15px;
}
#kaitou ul.flex li img {
	width: auto;
	display: block;
	border: 1px solid #999999;
	margin: 0;
}

#main #kaitou h2{
	background: url(image/kaitimg.gif) left center;
	background-size: cover;
	color: #FFFFFF;
	border: none;
}
.post_link {
	width: 100%;
	max-width: 320px;
	margin: 0 auto 25px auto;
	display: block;
}
.post_link img {
	width: 100%;
	height: auto;
	display: block;
}
.info_link {
	margin: 0 10px 25px 10px;
	padding: 0 !important;
	text-align: right;
}
.info_link a {
	width: auto;
	display: inline-block !important;
	margin: 0 !important;
	padding-right: 15px;
	position: relative;
}
.info_link a:after {
	content: '>';
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}

/* ----- バナー ----- */

#add_banner {
	margin-bottom: 25px;
}
#saikyou {
	background-color: #FFFFEA;
	padding: 10px;
	margin: 15px 0 25px;
}
#add_banner p, #saikyou p {
	text-align: center;
	font-size: 14px;
	line-height: 1.75;
	padding: 0;
	margin-bottom: 10px;
}
#add_banner p a, #saikyou p a{
	text-decoration: underline;
	font-weight: bold;
}
#add_banner a, #saikyou a{
	display: block;
}
#saikyou img, #add_banner img, #mb_add .link img	{
	width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}
#add_banner img:nth-child(2) {
	display: none;
	max-width: 300px;
	margin: 0 auto;
}
#mb_add .link img {
	max-width: 530px;
}
#map {
	border: 1px solid #F9176C;
	margin-bottom: 25px;
}
#map h2 {
	background: #F9176C;
	padding: 5px;
	color: #fff;
	border: none;
	font-size: 20px;
}
#map a {
	width: calc(100% - 20px);
	max-width: 300px;
	display: block;
	margin: 0 auto 10px auto;
}
#map img {
	width: 100%;
	height: auto;
	display: block;
}
#map p a {
	display: inline-block;
	margin: 0;
}

/* ----- srch ----- */

#srch {
	width: 260px;
}
.watermark#srchBox {
	width:260px;
	margin-bottom:10px;
	background-color:#FFFFFF;
	border-style:solid;
	border-width:1px;
	border-color:#EEEEEE;
	color:#000000;
	text-align:left;
}
.watermark#srchBox * {
	margin:0;
	padding:0;
	font-size:13px;
	*font-size:small;
	*font:x-small;
}
#srchBox a img {
	border:none;
}
.watermark#srchBox #srch {
	padding:10px 10px 0 10px;
}
.watermark#srchBox #srchInput {
	width:160px;
	margin-right:6px;
	vertical-align:bottom;
}
.watermark#srchBox #srchBtn {
	width:80px;
}
*html .watermark#srchBox #srchBtn {
	padding-top:2px;
}
*:first-child+html .watermark#srchBox #srchBtn {
	padding-top:2px;
}
.watermark#srchBox ul {
	margin-top:6px;
	text-align:left;
}
.watermark#srchBox li {
	list-style-type:none;
	display:inline;
	zoom:1;
	padding-right:10px;
}
.watermark#srchBox li input {
	zoom:1;
	margin-right:2px;
	_margin:-4px 0 -4px -4px;
	vertical-align:middle;
	border:0;
}
*:+html .watermark#srchBox li input {
	margin:-4px 0 -4px -4px;
}
.watermark#srchBox #srchLogo {
	margin:6px 6px 6px 0;
	text-align:right;
}
.watermark#srchBox #srchLogo a {
	color:#666666;
	text-decoration:none;
	font-size:85%;
}
.watermark#srchBox #srchLogo a:hover {
	text-decoration:underline;
}
.watermark#srchBox.watermark
{
padding-bottom: 6px;
}
.watermark#srchBox.watermark #srchInput {
padding:1px 1px 2px 1px;
border:1px solid #a5acb2;
background: #fff url(http://i.yimg.jp/images/search/customsearch/yjlogo/yjlogo_type4.gif) center center no-repeat;
}
.watermark#srchBox.watermark #srchInput.nomark {
background: #fff;
}
.watermark#srchBox.watermark #srchLogo {
	display: none;
}

.slicknav_menu {
	display: none;
}
ul#menu {
	display: none;
}
#mb_add {
	display: none;
}

#pageTop {
	background:#666;
	border-radius:5px;
	color:#FFF;
	padding:10px;
	position:fixed;
	bottom:16px;
	right:20px;
}
#pageTop:hover {
	background:#EEE;
}

@media screen and (max-width: 640px) {
	#pageall {
		width: 100%;
		padding: 10px;
	}

	#header p + a {
		width: 100%;
		text-align: right;
		margin-bottom: 10px;
	}

	#mb_add {
		width: 100%;
		display: block;
		margin-bottom: 25px;
	}
	#mb_add p {
		width: 100%;
		text-align: center;
		padding: 0;
	}

	#main, #navi {
		width: 100%;
		max-width: 100%;
	}
	#navi ul {
		display: flex;
		-js-display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: flex-start;
	}
	#navi li, #link li {
		width: 50%;
	}
	#h_navi ol li {
		margin-bottom: 5px;
		line-height: 20px;
	}
	#bot_pick {
		margin-bottom: 25px;
	}
	/* #menu is the original menu */

	ul#menu {
		display: none;
	}
	#menu li strong {
		color: #fff;
	}
	.slicknav_menu {
		display: block;
	}
	#pageall #main #mb_add .link a img {
		width: 100%;
	}
	#h_navi {
		display: none;
	}
	.submit {
		text-align: right;
	}
}

@media screen and (max-width:479px) {
	#pageall {
		background-size: contain;
	}
	#header p {
		width: 100%;
		text-align: left;
		padding: 0;
	}
	#header p + a {
		width: auto;
	}
	#navi ul {
		flex-direction: column;
	}
	#navi li, #link li {
		width: 100%;
	}
	table a {
		width: 100%;
	}
	table img {
		width: 100%;
		max-width: 70px;
		height: auto;
	}
	#update h2 {
		background-size: cover;
	}
	#mb_add p {
		text-align: center;
	}
	#add_banner img:first-child {
		display: none;
	}
	#add_banner img:nth-child(2) {
		display: block;
	}
	#archive ul {
		flex-direction: column;
	}
	#archive ul li {
		width: 100%;
		text-align: center;
	}
	#archive ul li:first-child {
		margin-bottom: 10px;
	}
	#archive ul li a {
		text-align: center !important;
	}
	.submit {
		text-align: center;
	}
	#kaitou ul.flex li {
		width: 50%;
	}
	#kaitou ul.flex li:first-child img {
		width: 100%;
		height: auto;
	}
}