@charset "utf-8";
/* CSS Document */

/*2024/02/26 EC機能追加　本サーバ用*/
.dl-menuwrapper li:nth-child(5):after {
	content:"";
}
main .article_box {
	margin: 0 auto;
	padding-top: 30px;
	width: 80%;
	display: flex;
	flex-wrap: wrap; /* 折返し指定 */
	background:rgba(255,255,255,0.9);
	/* justify-content:space-between; */
	justify-content:flex-start; 
    align-items: stretch;
    /* height: 100vh;  */
}
main .detail_box {
	margin: 0 auto;
	padding: 60px 40px 60px;
	width: 50%;
	background:rgba(255,255,255,0.9); 
	/* height: 100vh;  */
}
main .detail_img{
	display: flex;
	justify-content:center;
}
main .detail_box h2 {
	padding: 0.1em 0.5em;/*文字の上下 左右の余白*/
	color: #494949;/*文字色*/
	border-left: solid 3px rgb(12, 215, 241);/*左線*/
	border-bottom: solid 1px #666666;/*下線*/
	text-align: left;
  }
main .detail_img p{
	margin: 10px;
}
main .detail_overview{
	margin: 20px;
}
main .detail_overview p{
	 font-size: 16px;
     line-height: 1.8em;
}
main .price{
	font-size: 20px;
	text-align: center;
	font-weight: bold;
}
main .article_box h2{
	text-align: center;
	margin:0 0 20px;
	font-size:125%;/*20px*/
}
main .detail_box h2 {
	margin:20px 0 20px;
	font-size:125%;/*20px*/
}
main .article_box h2 a {
	text-decoration:none;
}
section.post_box {
	background:rgba(255,255,255,0.9);
	border: solid 1px #d7d7d7;
}
main .pic-item {
	text-align: center;
	margin-bottom: 20px;
}
main .article_box .post_box {
	margin:0 20px 60px;
	padding: 30px;
	width: 22%;
}
/* 最後のコンテンツを左寄せにする指定 */
.article_box:after {
	content: "";
	display: block;
	width:26%;  /* .boxに指定したwidthと同じ幅を指定する */
	height: 0;
}	
main .article_box .post_box h2{
	background-color: rgb(57, 150, 187);
	text-align: center;;
	border-radius: 4px;
	}
main .article_box .post_box h2 a{
	color:#ffffff;
	}
.post_box:nth-child(3n) {
	margin-right: 0;
  }
main .text-item p{
	margin-top: 20px;
	display: inline-block;
	text-align: right;
	width: 100%;
/* 	background-color: aqua; */
}
main .text-item ul{
	display: inline-block;
	text-align: right;
	width: 100%;
	margin-bottom: 20px;
	/* background-color: aqua; */
}
/* ガラクタ市 */
#header {
	height:80px;
}
main {
	background:url(../img/index/branding.jpg) no-repeat top center;
	/* height: 100vh;  */
	background-repeat: repeat-y;
}

#header .header_in h1 {
	width:250px;
	text-align:center;
}
#header .header_in h1 a {
	display:block;
	width:250px;
	padding:16px 0 0 23px;
	display: flex;
	align-items: center;
}
div.cautionary-statement{
	padding:8px 0;
	width:440px;
	margin-left: 180px;
}
div.cautionary-statement p{
	font-size: 12px;
	line-height: 16px;
	color: #666;
	white-space: nowrap
}
#header .header_in .header_left {
	width:calc(100% - 870px);
	padding:5px 15px 0 0;
}
/* オーダーフォーム */

/* 全幅指定 */
.full-width {
 /* margin: 0 calc(50% - 50vw);
    padding: 5em calc(50vw - 50%); */
	padding-top: 40px;
	margin: 0 auto 60px;
}
/* pタグの余白を削除 */
.wpcf7-form p {
    margin-bottom: 0;
}
/* 背景色（お好きな色に） */
section.contact {
    background-color: #FFF;
	padding: 40px;
	border: solid 1px #d7d7d7;
}
/*  フォームの幅（自由に変えてOK） */
.contactForm {
    max-width: 700px;
    margin: 0 auto;
}
/* 各項目の下部余白 */
.contact_item {
    margin-bottom: 2.5rem;
}
/* 項目名 */
.label {
    display: block;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: 0.05em;
    margin-bottom: .6rem;
    font-weight: bold;
}
/* 必須タグと任意タグ共通のスタイル */
.label_tag {
    font-size: 1rem;
    color: #ffffff;
    border-radius: .2rem;
    margin-right: 1rem;
    padding: 5px 10px;
}
/* 必須タグ */
.label_must {
    background-color: #C84772;
}
/* 任意タグ */
.label_option {
    background-color: #888988;
}
/* 名前やメールアドレスなどユーザーが入力する箇所 */
.inputs {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
input[type="text"],input[type="email"] {
    border: solid 1px #707070;
    padding: .5rem;
    font-size: 1rem;
}
/* お問い合わせ内容を入力する箇所 */
textarea.form-control {
    border: solid 1px #707070;
    padding: .5rem;
    height: 207px;
    font-size: 1rem;
}
/* ボタン */
.btnArea {
    text-align: center;
}
input[type="submit"]{
    background: #C84772;
    border: 2px solid #ffffff;
    width: 280px;
    color: #ffffff;
    text-align: center;
    font-size: 1.5rem;
    line-height: 1.3;
    /* letter-spacing: .5em; */
    text-indent: .5em;
    font-weight: bold;
    padding: 1.4rem 0;
    margin-top: 1rem;
	margin-bottom: 1rem;
    cursor: pointer;
    border-radius: .3rem;
    transition: all .3s;
    
}
/* ボタンにホバーした時 */
input[type="submit"]:hover {
    color: #C84772;
    background-color: #ffffff;
    border-color: #C84772;
}
/* ローダー */
.wpcf7 .ajax-loader {
    display: block;
    margin: 0 auto;
}
/* モバイル版 */
@media screen and (max-width: 480px) {
    .contact_item {
        margin-bottom: 1.6rem;
    }
    .label {
        font-size: 1rem;
        margin-bottom: .4rem;
    }
    .label_tag {
        font-size: 1.1rem;
    }
    input[type="text"],input[type="email"] {
        padding: .4rem;
        font-size: 1rem;
    }
    textarea {
        padding: .4rem;
        font-size: 1rem;
    }
    input[type="submit"]{
        font-size: 1.5rem;
    }
}

/* フォームの成型 */
.wpcf7 input[name="post_title"] { /* 会社名入力欄 */
	width: 100%;
}
.wpcf7 input[name="your-company"] { /* 会社名入力欄 */
	width: 100%;
    background-color: #DBE6F2;
}
.wpcf7 input[name="your-name"] { /* 名前入力欄 */
	width: 100%;
	background-color: #DBE6F2;
}
.wpcf7 input[name="your-tel"] { /* 電話番号入力欄 */
	width: 100%;
	background-color: #DBE6F2;
}
.wpcf7 input[name="your-email"] { /* メール入力欄 */
	width: 100%;
	background-color: #DBE6F2;
}
.wpcf7 textarea[name="your-message"] { /* 本文入力欄 */
	width: 100%;
	background-color: #DBE6F2;
}
input[name="post_title"]{
	border: none !important;
	font-size: 20px;
	font-weight: bold;
}

/* 欠品ボタン */
.shortagemark {
	display: block;
    background: #fd9a06;
    font-size: 1rem;
	text-align: center;
    color: #fff;
    border-radius: .2rem;
    margin:0 auto 60px;
    padding: 5px 10px;
	width:120px;
}

/*固定ページ用テンプレート*/
main .staticpage  {
	margin: 0 auto;
	padding-top: 30px;
	width: 60%;
	background:rgba(255,255,255,0.9);
	/* height: 100vh;  */
}
main .staticpage .inner {
	margin: 0 auto;
	padding: 30px 0 80px;
	width: 90%;
	background:#fff;
	font-size:16px;
}
main .staticpage h2 {
	padding: 0.1em 0.5em;/*文字の上下 左右の余白*/
	color: #494949;/*文字色*/
	border-left: solid 3px rgb(12, 215, 241);/*左線*/
	border-bottom: solid 1px #666666;/*下線*/
	text-align: left;
	width: 96%;
	margin: 0 auto 40px;
  }
/*よくある質問*/
.qa-8{
	padding:0 20px 100px;
}
.qa-8 dt {
	margin-top: 2em;
    margin-bottom: 1.5em;
    color: #333333;
    font-weight: bold;
}

.qa-8 dt::before,
.qa-8 dd::before {
    margin-right: .4em;
}

.qa-8 dt::before {
    content: "Q.";
	color: lightskyblue;
}

.qa-8 dd {
    margin: 0 0 2.5em;
    padding: 1em 1.5em;
    background-color: #ddedee;
    color: #333333;
}

.qa-8 dd::before {
    content: "A.";
	color: #C84772;
	font-weight: bold;
}

/*プライバシーポリシー*/
main .staticpage .inner p.lead{
	display: block;
	margin: 20px auto 40px;
	padding: 16px;
	width:90%;
	background: #DBE6F2;
	border: solid 1px #eee;
	border-radius: .2rem;
}
main .staticpage .inner ol{
	padding-inline-start: 20px;
	list-style-position: inside;
	text-indent: -1em;
	padding-left: 1em;
	width:90%;
	margin:20px auto 20px;
}
main .staticpage .inner ol li {
	margin-top: 20px;
	margin-bottom: 10px;
}
main .staticpage .inner ol li span {
	margin-top: 20px;
	font-weight: bold;
}

/* 特定商取引法に基づく表記 */
main table.scta {
	max-width:90%;
	margin:40px auto;
	border-collapse:  collapse; /* セルの線を重ねる */
}
main table.scta th {
	font-weight:normal;
	width:25%;
	padding:16px;
	text-align:left;
	background-color: #F5F5F5;
	border:1px solid #c9c9c9;
}
main table.scta td {
	width:75%;
	padding:16px;
	text-align:left;
	border:1px solid #c9c9c9;
}
@media screen and (min-width: 0px) and (max-width: 1680px) {

	main .article_box .post_box {
		margin:0 17px 60px;
		width: 30%;
		/* background-color: #C84772; */
	}
}
@media screen and (min-width: 0px) and (max-width: 1440px) {
	#header .header_in .header_left p{
		font-size:12px;
	}
}
@media screen and (min-width: 0px) and (max-width: 1420px) {
	#header .header_in {
		background:rgba(255,255,255,1.0) url(../img/global/logo_bg.png) no-repeat left -60px center;
	}
	#header .header_in .header_left {
		width:calc(100% - 100px);
		padding:5px 5px 0 0;
	}
		main .article_box {
		margin: 0 auto;
		padding-top: 30px;
		width: 80%;
		display: flex;
		flex-wrap: wrap; /* 折返し指定 */
		background:rgba(255,255,255,0.9);
		/* justify-content:space-between; */
		justify-content:flex-start; 
		align-items: stretch;
		/* height: 100vh;  */
	}
	main .article_box .post_box {
		margin:0 17px 60px;
		width: 25%;
	}
	div.cautionary-statement{
		padding:8px 0;
		width:15%;
		margin-left: 10%;
	}
	div.cautionary-statement p{
		font-size: 10px;
		line-height: 16px;
		color: #666;
	}
}
@media screen and (min-width: 0px) and (max-width: 1370px) {
	.dl-menuwrapper li a {
		padding:0 5px 2px;
		font-size:90%;/*13px*/
	}
	main .article_box {
		margin: 0 auto;
		padding-top: 30px;
		width: 80%;
		display: flex;
		flex-wrap: wrap; /* 折返し指定 */
		background:rgba(255,255,255,0.9);
		justify-content:space-between;
		align-items: stretch;
		/* height: 100vh;  */
	}
	main .article_box .post_box {
		margin:0 17px 60px;
		width: 25%;
	}
	section.post_box {
		background:rgba(255,255,255,0.9);
		padding: 30px;
		border: solid 1px #d7d7d7;
	}
	main .detail_box {
		margin: 0 auto;
		padding: 60px 40px 60px;
		width: 90%;
		background:rgba(255,255,255,0.9); 
		/* height: 100vh;  */
	}
	/*固定ページ用テンプレート*/
	main .staticpage  {
		margin: 0 auto;
		padding-top: 30px;
		width: 90%;
		background:rgba(255,255,255,0.9);
		/* height: 100vh;  */
	}
}
@media screen and (min-width: 0px) and (max-width: 1240px) {
	.dl-menuwrapper li a {
		padding:0 5px 2px;
		font-size:90%;/*13px*/
	}
	main .article_box {
		margin: 0 auto;
		padding-top: 30px;
		width: 100%;
		display: flex;
		flex-wrap: wrap; /* 折返し指定 */
		background:rgba(255,255,255,0.9);
		justify-content:space-between;
		align-items: stretch;
		/* height: 100vh;  */
	}
	main .article_box .post_box {
		margin:0 20px 60px;
		width: 46%;
	}
	section.post_box {
		background:rgba(255,255,255,0.9);
		padding: 30px;
		border: solid 1px #d7d7d7;
	}
	main .detail_box {
		margin: 0 auto;
		padding: 60px 40px 60px;
		width: 90%;
		background:rgba(255,255,255,0.9); 
		/* height: 100vh;  */
	}
	/*固定ページ用テンプレート*/
	main .staticpage  {
		margin: 0 auto;
		padding-top: 30px;
		width: 90%;
		background:rgba(255,255,255,0.9);
		/* height: 100vh;  */
	}
}

@media screen and (min-width: 0px) and (max-width: 900px) {
	main .article_box .post_box {
		margin:20px 20px 60px;
		width: 90%;
	}
	#header .header_in{
		display: flex;
		flex-flow: column;
	}
	div.cautionary-statement{
		padding:8px 0;
		width:80%;
		height: 100px;;
		margin: 50px auto 20px;
		/* background-color: #C84772; */
	}
	div.cautionary-statement p{
		font-size: 12px;
		line-height: 16px;
		color: #666;
		white-space: nowrap;
	}
	main .article_box {
		margin: 0 auto;
		padding-top: 120px;
		width: 100%;
		display: flex;
		flex-wrap: wrap; /* 折返し指定 */
		background:rgba(255,255,255,0.9);
		justify-content:space-between;
		align-items: stretch;
		/* height: 100vh;  */
	}
	main .detail_box {
		margin: 0 auto;
		padding: 100px 40px 60px;
		width: 90%;
		background:rgba(255,255,255,0.9); 
		/* height: 100vh;  */
	}
	main .detail_box h2 {
		margin:40px 0 20px;
		font-size:125%;/*20px*/
	}
}