@charset "utf-8";
/*
Theme Name: Lightning Simple
Theme URI: https://na2ki.net
Template: lightning
Description: デモサイトシンプルプランのテーマです。
Author: natsuki
Tags: 
Version: 0.1.2
*/

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/****************************************
	　　フォント
*****************************************/

body {
    font-family: "游ゴシック", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif !important;
    font-weight: 500;
}


/**------------------------------------------
  ■ ︎ 見出し、その他
------------------------------------------**/
h2, h3, h4, h5, h6, #topmenu ul li a, .media-heading, .product_title {
    font-family: "Noto Sans Japanese", "游ゴシック", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif !important;
}

.mainSection-title {
	color: initial;
	text-shadow: initial;
	background: initial;
	border: initial;
	box-shadow: initial;
	text-align: center;
	margin-top: 45px;
}
@media screen and (max-width:767px) {
	.h2, .h3, .h4, .h5, .h6, .mainSection-title, h2, h3, h4, h5, h6 {
		margin: 0;
	}
}

.gMenu_name,
.subSection-title,
.prBlock_title{
	font-weight: bold;
}

@media (max-width: 767px){
.media .media-body .media-heading {
	font-size: 1em;
}
}

/**------------------------------------------
  ■ ︎ Elementor見出しcssリセット
------------------------------------------**/
h2.elementor-heading-title, h3.elementor-heading-title, h4.elementor-heading-title,
.elementor-page h2, .elementor-page h3, .elementor-page h4 {
	color: initial;
	font-size: initial;
	text-shadow: initial;
	background: initial;
	border: initial;
	box-shadow: initial;
}
h2.elementor-heading-title::before, h3.elementor-heading-title::before, h4.elementor-heading-title::before, h2.elementor-heading-title::after, h3.elementor-heading-title::after, h4.elementor-heading-title::after,
.elementor-page h2::before, .elementor-page h3::before, .elementor-page h4::before ,.elementor-page h2::after, .elementor-page h3::after, .elementor-page h4::after {
	color: initial;
	font-size: initial;
	text-shadow: initial;
	background: initial;
	border: initial;
	box-shadow: initial;
}

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

.navbar-brand {
	font-size: 18px;
	font-weight: bold;
}

#vk-mobile-nav-menu-btn {
	display: none;
}



/****************************************
	　　コンテント
*****************************************/

/**------------------------------------------
  ■ ︎ PRブロック
------------------------------------------**/
.prBlock, .prArea {
	padding: 20px;
}

.prBlock:hover,
.prArea:hover {
	background: #fafafa;
}

.media_pr img:hover,
.carousel-inner img:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}

.prBlock_icon_outer:hover {
	transform: scale(1.3);	/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}

.prBlock a .prBlock_summary:hover {
	text-decoration: none;
}

.prArea .btn {
	display: block;
	width: 150px;
	margin: 40px auto;
}

.prArea .subSection-title,
.prArea .subSection-title:after {
	border-bottom: none;
	box-shadow: none;
	text-align: center;
}

@media screen and (max-width: 992px){
	.prBlock {
		margin-bottom: 0
}
}

@media screen and (max-width:767px) {
	.veu_3prArea_image {
		width: 100%;
		float: none;
	}
	
	.summary {
		height: auto !important;
	}
	.media-body p {
		display: none;
	}
}

@media screen and (max-width:500px) {
	.media .postList_thumbnail {
		width: 150px;
	}
}

/**------------------------------------------
  ■ ︎ テーブル
------------------------------------------**/
.table th, table th {
	font-weight: bold;
	white-space: nowrap;
}

@media screen and (max-width:767px) {
	.table-summary th, .table-summary td { width: 100%; display: block; }
	.table-summary th { text-align: center; background: #f4f4f4; font-weight: bold; }
}

/**------------------------------------------
  ■ ︎ フォーム
------------------------------------------**/
label {
        width: 100%;
}

div.wpcf7 {
	padding: 0 10%;
}
@media screen and (max-width:767px) {
	div.wpcf7 {
	padding: 0;
}
}

.wpcf7-submit {
	width: 300px;
	max-width: 100%;
	padding: 20px;
	font-weight: bold;
}

.wpcf7-submit:hover {
	opacity: 0.6;
}

table.table-form th.required::after {
    content: "*";
    color: red;
    margin-left: 3px;
}

.haveto {
	color: red;
}

/**------------------------------------------
  ■ ︎ マウスオーバー
------------------------------------------**/
img:hover, a:hover  {
	opacity: 0.8;
	text-decoration: none;
}

.media:hover {
	background: #fafafa;
	padding: 20px;
}

.media:hover .media-heading {
	font-weight: bold;
}

/**------------------------------------------
  ■ ︎ その他
------------------------------------------**/
.ta_center {
	text-align: center;
}

em,strong,.bold {
	font-weight: bold;
	font-style: normal !important;
}

.mark_yl {
	background: none repeat scroll 0 0 rgba(242, 212, 73, 0.4);
	font-weight: bold;
}

.mark_gr {
	background: none repeat scroll 0 0 rgba(242, 212, 73, 0.4);
	font-weight: 400;
}

.red {
	color: #f20860 !important;
}

.blue {
	color: #36B1BF !important;
}

.big {
	font-size: 20px;
}

.small {
	font-size: 12px;
}

.single ul{
	padding: 0 0 0 20px;
	line-height: 1.8;
	font-size: 14px;
	color: #434343;
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}

.single .fa-li {
	color: #f20860;
	line-height: 1.6;
}

span.key {
	background: #f20860;
	color: #fff;
	padding: 1px 5px;
	border-radius: 5px;
}

div.box {
	width: auto;
    background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0;
    padding: 15px;
	border: solid 2px #fafafa;
	margin: 40px 0;
}

div.attention {
	width: auto;
    background: rgba(242, 8, 96, 0.1) none repeat scroll 0 0;
    padding: 15px;
	margin: 40px 0;
}


blockquote {
    background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0;
   	border: 1px dashed #33BFDB;
    padding: 20px 40px;
	margin: 40px 0;
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size: 14px;
}

.mb40 {
	margin-bottom: 40px;
}



/**------------------------------------------
  ■ ︎ モバイル
------------------------------------------**/
@media screen and ( max-width:540px){
	img.alignleft, img.alignright {
		width: 100%;
		float: none;
		margin: 10px 0 5px;
	}
}