/*--
Theme Name: Arkhe child
Theme URI: https://arkhe-theme.com/
Version: 1.5.6
Author: LOOS,Inc.
Author URI: https://loos.co.jp/
Description:WordPressテーマ「Arkhe」の自作子テーマ
Template: arkhe
*/


body{
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	letter-spacing:0.05em;
}

a{
	text-decoration:none;
}

/***********************************************************
* ヘッダー
***********************************************************/

.l-header{
	border-top: 5px solid #003a60;
	padding: 5px 0;
	border-bottom: 1px solid #d6eaf1;
}

/*---------- メニュー　----------*/
.c-gnav__li>.c-gnav__a{
	padding:16px 18px;
	color:#003a60;
}
.c-gnav__li>.c-gnav__a:hover{
	color:#003a60;
	border-bottom:3px solid #003a60;
}

/***********************************************************
* トップページ
***********************************************************/
.home .l-content{
	margin-bottom:50px;
}

.flont-message{
	font-size:1.1em;
	line-height:2em;
	text-align:center;
	font-family: 'Shippori Mincho', serif;
	margin:100px auto;
}

.flont-title{
	font-size:1.5em;
	font-weight:500;
	text-align:center;
	color:#003a60;
}
.flont-title span{
	display:block;
	font-size:14px;
}
.onlineshop-bana{
	margin:80px auto 20px;
}
@media screen and (max-width: 800px){
	.flont-message{
		font-size:1em;
	}
}
@media screen and (max-width: 500px){
	.flont-message{
		font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
		font-size:.9em;
		letter-spacing:0;
		margin:60px 10px;
		text-align:left;
	}
	.onlineshop-bana{
		margin:30px auto 0;
	}
}

/*---------- メインビジュアル　----------*/
.main-image{
	background-image:url(../images/main-image.jpg);
	background-size: cover;
	margin: 0 calc(50% - 50vw);
	width:100vw;
	height: 90vh;
}
.main-image{
	display:flex!important;
	justify-content: center;
	align-items:center;
	
}
.main-image .catchcopy{
	font-family: 'Shippori Mincho', serif;
	font-size:1.9em!important;
	line-height: 2em!important;
	color:#003a60;
}
@media screen and (max-width: 800px){
	.main-image .catchcopy {
		font-size: 1.3em!important;
		line-height: 2em!important;
	}
}
@media screen and (max-width: 500px){
	.main-image .catchcopy {
		font-size: 1em!important;
	}
}
/*---------- 新着情報　----------*/
.news_wrap{
    margin: 3em calc(50% - 50vw) 0;
    padding: 4em;
	width:100vw;
	background-color:#f5f5f5;
	background-image:url(../images/news-bg.jpg);
	background-size:cover;
}
.news_wrap .news{
	display:flex;
	max-width:1000px;
	margin: 0 auto;
}
.news_wrap .news .midashi{
	text-align: center;
    line-height: 120px;
	width: 120px;
	height: 120px;
    color: #a7a7a7;
    background-color: #182c7e;
    color: #fff;
	margin-right:40px;
}
ul.news_list{
    display: flex;
    align-items: center;
    font-size: .9em;
    width: 80%;
    padding: 0;
    flex-direction: column;
    align-self: center;
}
ul.news_list li{
	width:100%;
	list-style:none;
}
ul.news_list li::before{
	background: unset;
}
ul.news_list li a{
	color:#111;
	font-weight:500;
}
ul.news_list .add_New{
	color:red;margin-left:10px;
	font-size:.9em;
}
ul.news_list .news_date{
	margin-right:10px;
	letter-spacing:.07em;
	width: 140px;
	display: inline-block;
}
@media screen and (max-width: 500px){
	.news_wrap {
		margin: 2em calc(50% - 50vw) 0;
		padding: 2em 1.5em;
	}
	.news_wrap .news .midashi{
		margin-right:20px;
	}
	ul.news_list .news_date{
		display:block;
	}
}

/*---------- お問い合わせ　----------*/
.flont-contact{
	color: #fff;
	background-color:#6cb5ce;
	margin: 0 calc(50% - 50vw);
    width: 100vw;
	padding: 6% 10% 7%;
}
.flont-contact .title{
	font-size:1.6em;
	font-weight:bold;
	text-align:center;
}
.flont-contact .title .lead{
	font-size:14px;
}
.flont-contact .action{
	display:flex;
	justify-content:space-between;
	max-width:1000px;
	width:100%;
	margin: 50px auto 10px;
}
.flont-contact .tel-action{
	width:45%;
}
.flont-contact .tel-title{
	font-weight: bold;
    text-align: center;
    border: 1px solid #fff;
}
.flont-contact a.telnum{
	color: #fff;
    font-size:1.6em;
	font-weight:bold;
}
.flont-contact .mail-action{
	width:45%;
}
.flont-contact .mail-action a.mailbtn{
	display:block;
	width:100%;
	color: #68b6d2;
	background-color:#fff;
	text-align:center;
	padding: 30px 15px;
	font-size: 1.4em;
}
@media screen and (max-width: 800px){
	.flont-contact .action{
		flex-wrap:wrap;
	}
	.flont-contact .tel-action,
	.flont-contact .mail-action{
		width:100%;
	}
	.flont-contact .tel-action{
		margin-bottom:30px;
		text-align:center;
	}
	.flont-contact .mail-action a.mailbtn{
		padding: 15px 15px;
	}
}
@media screen and (max-width: 500px){
	.flont-contact .tel-action .time{
		font-size:.9em;
	}
}
/***********************************************************
* 各種固定ページ
***********************************************************/

.p-topArea{
	min-height: 20vh;
}
.p-topArea .c-pageTitle__main{
	font-size: 1.6rem;
}

.l-main h2{
	font-size: 1.6em;
	font-weight: 500;
	color: #003a60;
}
.l-main h3{
	font-size: 1.3em;
	font-weight: 500;
	color: #003a60;
}
/*---------- 会社概要　----------*/

.aisatsu{
	background-color:#f9fdff;
	border: 1px solid #f1f6f9;
	padding:5%;
}
.aisatsu h2{
	font-size: 1.3em;
}
.about table{
	border-top: 1px solid #003a60;
	border-right: unset;
}
.about th,
.about td{
	border-bottom: 1px solid #003a60;
	border-left: unset;
}
.about th{
    width: 20%;
    color: #003a60;
    font-weight: 500;
    padding: 0.5em 1em!important;
    vertical-align: middle;
}
/*---------- お問い合わせ　----------*/
.wpcf7-form ::placeholder {
	color: #a5a5a5;
	letter-spacing:0.05em;
}
.wpcf7-not-valid-tip{
	font-size:.85em;
	display:unset;
	margin-left:5px;
}
button, input, select, textarea{
	padding:0.35em 0.7em;
}
table.contact{
    border-right: unset;
}
table.contact th{
	width: 25%;
    padding: 0.7em 1em;
    background-color: unset;
    font-weight: normal;
	font-size:.9em;
    vertical-align: middle;
}
table.contact th,
table.contact td{
	border-left: unset;
	padding:15px 10px!important;
}
table.contact .any,
table.contact .req{
	font-size:.5em;
	margin-right:10px;
	padding:3px 8px;
	border-radius:3px;
	color:#fff;
}
table.contact .any{
	background-color:#bbbbbb;
}
table.contact .req{
	background-color:#eb2400;
}
table.contact input{
	width:70%;
}
table.contact textarea{
	width:100%;
	max-height:200px;
}
.contact-under{
	font-size:.9em;
	text-align:center;
	margin:0 auto;
}
.contact-under [type=submit]{
    font-size:1.1em;
    letter-spacing: 0.05em;
	color:#fff;
    padding: 10px 30px;
    margin-top: 40px;
    margin-right: -72px;
    border: 1px solid #182c7e;
	background-color: #182c7e;
}
.contact-under [type=submit]:hover{
	border: 1px solid #283f9c;
	background-color: #283f9c;
}
@media screen and (max-width: 700px) {
	table.contact th,
	table.contact td{
		display:inline-block;
		width:100%;
	}
	table.contact input[type="text"],
	table.contact input[type="tel"],
	table.contact input[type="email"]{
		width:100%;
	}
}


/***********************************************************
* アーカイブページ
***********************************************************/
.archive .l-content__body{
    margin: 0 auto 3rem;
}

.p-archive__title{
	display: flex;
justify-content: center;
  align-items: center;
	margin: 0 calc(50% - 50vw);
	width:100vw;
	background-color:#ababab;
	text-align:center;
	background-image:url(../images/head-bg2.jpg);
	background-size: cover;
    background-position: center;
	min-height: 20vh;
	padding: 2rem 0;
}
.p-archive__title h1{
	align-items:middle;
	font-size: 1.6rem;
	color: #ffffff;
	text-shadow: 1px 1px 0 #0000001a;
}


.p-postList{
	margin-top:50px;
}

/***********************************************************
* 投稿
***********************************************************/
.single-post .l-content__body {
    margin: 0 auto 3rem;
}
.p-entry__title{
	margin-top:30px;
}
.single-post .c-pageTitle__main{
	font-size:1.5em;
	color:#003a60;
}


/***********************************************************
* フッター
***********************************************************/
.p-breadcrumb{
	border-top:1px solid #ddd;
}
.l-footer__inner{
	border-top:1px solid #f7f7f7;
}
.l-footer__widgets {
	background-image:url(../images/footer-bg.jpg);
	background-size:cover;
	background-position:center;
	background-color:rgba(255,255,255,0.9);
	background-blend-mode:lighten;
	text-align:center;
}
.footer-about{
	font-size: .9em;
    color: #182c7e;
}
.l-footer {
    background-color: #182c7e;
    color: #fff;
}
.l-footer .l-container{
	display:flex;
}
.l-footer__nav{
	margin-bottom:0;
}
.c-copyright{
	color:#fff;
	margin-left:auto;
}
@media screen and (max-width: 800px){
	.l-footer .l-container {
		display: block;
	}
	.l-footer__nav{
		margin-bottom:10px;
	}
}


/***********************************************************
* その他共通
***********************************************************/
.c-fixBtn {
	background: #182c7e;
}
/***********************************************************
* オンラインショップ
***********************************************************/
.soryo thead th{
	background-color:#ababab;
	font-size:.9em;
}

/*---------- 商品一覧　----------*/
.wc-item-list{
	display:flex;
	flex-wrap: wrap;
	justify-content:space-between;
	margin-top:50px;
	padding: 0;
}
.wc-item-list::after{
  content:"";
  display: block;
  width:30%;
}
.wc-item-list li{
	list-style:none;
	width:30%;
	margin-bottom:20px;
}
.wc-item-list li .itemname{
	font-size:.9em;
	margin-top:10px;
	height:42px;
	overflow:hidden;
}
.wc-item-list li .itemprice{
	text-align:right;
	margin-top:5px;
	color:#c70f0f;
}
.wc-item-list li .itemprice .tax{
	font-size:10px;
}
.wc-item-list li .item-img{
	position:relative;
	border: 1px solid #f7f7f7;
}
.wc-item-list li .zaiko-status{
	color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
}
.wc-item-list li .zaiko-status p{
    position: absolute;
    top: 50%;
    width: 100%;
    font-size: 16px;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    letter-spacing: .5px;
}
.wc-item-list li a.btn{
	display: block;
    color: #ffffff;
    background-color: #6cb5ce;
    border: 1px solid #6cb5ce;
    padding: 8px 15px;
    margin-top: 15px;
    text-align: center;
    font-size: 14px;
}
.wc-item-list li a.btn:hover{
	border:1px solid #6cb5ce;
	color:#6cb5ce;
	background-color:#fff;
}
@media screen and (max-width: 700px) {
	.wc-item-list li{
		width:49%;
	}
}



.p-topArea.-noimg{
	background-image: url(../images/head-bg2.jpg);
	background-size: cover;
    background-position: center;
}