@charset "utf-8";

@import url("/lib/com_style.css");



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

    共通ヘッダ #headerCom

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

/*-------------------------------------------------------------------
 spiral 宇宙空間と体内空間の螺旋相反解消システム　集合画像ページヘッダ
 --------------------------------------------------------------------*/
.akPhoto.spiral #HeaderCom {
	background-color:#af96a2;
}
.akPhoto.spiral #HeaderCom .HeadInner {
	width: 100%;
}


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

    コンテンツ #Contents

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

/*-------------------------------------------------------------------
 spiral 宇宙空間と体内空間の螺旋相反解消システム
 集合画像ページ基本コンテンツ
 --------------------------------------------------------------------*/
.akPhoto.spiral #Contents {
    width: 100%;
	max-width:inherit;
}

.akPhoto.spiral .ContBoxRight {
	padding:30px 40px;
}


/*----------------------------------------------------
  内容
----------------------------------------------------*/

/*-------------------------------------------------------------------
 spiral 宇宙空間と体内空間の螺旋相反解消システム
 --------------------------------------------------------------------*/
.akNet.spiral .SentenceBox .spiralList {
	display:table;
	width:100%;
	box-sizing:border-box;
}
.akNet.spiral .SentenceBox .spiralList > li {
	display:table-cell;
	vertical-align:top;
}
.akNet.spiral .SentenceBox .spiralList > li:nth-child(1) {
	width:78%;
}
.akNet.spiral .SentenceBox .spiralList > li:nth-child(2) {
	width:22%;
}

.akNet.spiral .ip {
	width: 2%;
	display: table-cell;
}

.akNet.spiral .SentenceBox h3 {
	width:76%;
    margin-left: 0;
	text-indent: 0;
	display: table-cell;
}
.akNet.spiral .SentenceBox h3:after {
    content: inherit;
    padding-right: 0;
}
.akNet.spiral .SentenceBox .iconimg img {
	width: 100%;
	border-radius: 5px;
	border: 1px solid #ccc;
	box-sizing: border-box;
}
.akNet.spiral .SentenceBox .mdash {
	padding: 0 2% 0 4.5%;
}
.akNet.spiral .SentenceBox .txtlink {
	font-size:85%;
	text-align:center;
}

.akNet.spiral .FormBtn .btn-all label,
.akNet.spiral .FormBtn .btn-submit {
    width: 18.354%;
}


.akPhoto.spiral .phList li {
    width: 50%;
}

/*-------------------------------
 iPadの横サイズ設定
 -------------------------------*/
/*　iPadの横　*/
@media only screen and (min-device-width:768px) and (max-device-width:1366px) and (orientation:landscape) {
	.akPhoto.spiral .phList li {
		width: 33.33333%;
	}
}

/*-------------------------------
 画面サイズ1221pxから
 -------------------------------*/
/*　画面サイズが1221pxから共通　*/
@media screen and (min-width:1221px) {
	.akPhoto.spiral .phList li .photo {
		text-align: center;
	}
	.akPhoto.spiral .phList li img {
		max-width: 536px;
	}
}

/*　画面サイズが1221pxから1708pxまで　*/
@media screen and (min-width:1221px) and (max-width:1708px) {
	.akPhoto.spiral .phList li {
		width: 33.33333%;
	}
}

/*　画面サイズが1709pxから2246pxまで　*/
@media screen and (min-width:1709px) and (max-width:2246px) {
	.akPhoto.spiral .phList li {
		width: 25%;
	}
}

/*　画面サイズが2247pxから2784pxまで　*/
@media screen and (min-width:2247px) and (max-width:2784px) {
	.akPhoto.spiral .phList li {
		width: 20%;
	}
}

/*　画面サイズが2785pxから3322pxまで　*/
@media screen and (min-width:2785px) and (max-width:3322px) {
	.akPhoto.spiral .phList li {
		width: 16.66666666666667%;
	}
}

/*　画面サイズが3323pxから3860pxまで　*/
@media screen and (min-width:3323px) and (max-width:3860px) {
	.akPhoto.spiral .phList li {
		width: 14.28571428571429%;
	}
}

/*　画面サイズが3861pxから　*/
@media screen and (min-width:3861px) {
	.akPhoto.spiral .phList li {
		width: auto;
	}
}

		
/*----------------------------------------------
 全システム　コンパクトリスト他　共通タイトル
 ----------------------------------------------*/
.SpiralTtl {
	font-family: "FOT-筑紫ゴシック Pro B", sans-serif;
	color: #a8768d;
	font-size: 130%;
	padding:10px;
	margin-bottom:15px;
	border-top: #ccc solid 1px;
	border-bottom: #ccc solid 1px;
}



@media screen and (max-width:960px) {
	
	/*-------------------------------------------------------------------
	 spiral 宇宙空間と体内空間の螺旋相反解消システム　拡張宇宙 / 宇宙
	 --------------------------------------------------------------------*/
	.akNet.spiral .SessionId {
		position: initial;
		top: 0;
		right: 0;
		display: block;
		text-align: right;
	}
	.akNet.spiral .FormBtn .btn-all label,
	.akNet.spiral .FormBtn .btn-submit input {
		font-size: 85%;
	}
	
	.akPhoto.spiral .ContBoxRight {
		padding: 10px;
	}
	
}
@media screen and (max-width:640px) {
	
	/*-------------------------------------------------------------------
	 spiral 宇宙空間と体内空間の螺旋相反解消システム
	 --------------------------------------------------------------------*/
	.akNet.spiral .SentenceBox .spiralList {
		letter-spacing: -0.5em;
	}
	.akNet.spiral .SentenceBox .spiralList > li {
		display: inline-block;
		letter-spacing: normal;
	}
	.akNet.spiral .SentenceBox .spiralList > li:nth-child(1) {
		width:100%;
	}
	.akNet.spiral .SentenceBox .spiralList > li:nth-child(2) {
		width:100%;
		padding-top:10px;
		vertical-align:middle;
	}
	
	.akNet.spiral .ip {
		width: 7%;
	}
	
	.akNet.spiral .SentenceBox h3 {
		width: 93%;
	}

	.akNet.spiral .SentenceBox .iconimg {
		width:30%;
		padding-left:7%;
		display: table-cell;		
	}
	.akNet.spiral .SentenceBox .txtlink {
		width:63%;
		padding-left:20px;
		display: table-cell;
		vertical-align:middle;
		box-sizing:border-box;
	}
	.akNet.spiral .SentenceBox .txtlink span {
		width: 100%;
		padding: 4px 5px;
		color: #fff;
		font-size:90%;
		text-decoration: none;
		border-radius: 7px;
		background-color: #af96a2;
		display: inline-block;
		box-sizing: border-box;
	}

	.akNet.spiral .topList li {
		width:100%;
		padding:0 0 10px;
	}
	.akNet.spiral .SentenceBox h3 {
		font-size: 90%;
	}
	.akNet.spiral .SentenceBox .mdash {
		font-size: 85%;
	}
	.akNet.spiral .FormBtn .btn-all label {
		width: 6.2em;
		padding: 13px 7px 0;
	}
	.akNet.spiral .FormBtn .btn-submit {
		width: 32.031%;
	}
	.akNet.spiral .FormBtn .btn-all,
	.akNet.spiral .FormBtn .btn-submit input {
		font-size: 75%;
	}


	.akPhoto.spiral .phList li {
		width: 100%;
	}
	.akPhoto.spiral .listBtn input {
		width: 80vw;
	}
	
}