@charset "utf-8";

/* レイアウト */
@media only screen and (max-width:767px){
body { font-size: 14px; }
}

@media only screen and (max-width:1023px){
#header { height:56px; width:100%; min-width:0; position:sticky; left:0px; top:0px; z-index:100; margin:0;box-shadow: 0 0 5px 0 rgb(0 0 0 / 40%); }
#header_inner { height:auto; width:100%; height:56px; margin:0 auto; position:relative; }
.mobile .mobile_header_fix #header { position:fixed; }
.home #header { position:sticky; background:#262e31; }
.home #top { margin-top: 0; }
}

@media only screen and (max-width:767px) {
#header_inner { width:100%; }
}

@media only screen and (max-width:991px){
#left_col { width:auto; float:none; padding:0 0 40px 0; }
#side_col { width:auto; float:none; padding:0 0 10px 0; }
}

@media only screen and (max-width:767px){
#main_contents { width:auto; margin:0 auto; padding:0; }
.mobile_header_fix #main_contents { padding-top:56px; }
.home.mobile_header_fix #main_contents { padding-top:0px; }
#main_col { width:auto; margin:20px auto 20px; padding:0 20px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
}

@media only screen and (max-width:767px){
.page-template-page-noside #main_col,
.page-template-page-noside-notitle #main_col,
.error404 #main_col { width:auto; float:none; margin:0 auto 20px; }
.page #main_col { margin-top:15px; padding-top:15px; }
.page-template-page-title #main_col,
.page-template-page-category-noCTA #main_col { margin-top: 0 !important; padding-top: 0 !important; }
}




/* ----------------------------------------------------------------------
トップページ
---------------------------------------------------------------------- */
@media only screen and (max-width:1320px){
.mobile_header_fix.home #top { padding-top:56px; }
}
@media only screen and (max-width:767px){
.home #top { min-width:0; margin:0 0 50px 0; }
}

/* スライダー */
@media only screen and (max-width:767px){
#header_slider { height:500px; min-width:0; }
#header_slider .item { height:500px; }
#header_slider .item img { display:none; }
}

/* スライダーのキャッチコピー */
@media only screen and (max-width:767px){
#header_slider .caption, #header_video .caption, #header_youtube .caption {
  width:100%; padding:0 50px;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#header_slider .caption .title, #header_video .caption .title, #header_youtube .caption .title { font-size:30px !important; line-height: 1.3; }
#header_slider .caption .desc, #header_video .caption .desc, #header_youtube .caption .desc { font-size:14px !important; line-height: 1.75; margin-top: 10px; }
#header_slider .caption .desc br {display: none;}
#header_slider .slick-dots { bottom:100px; }
#header_slider.no_slider_nav .slick-dots { bottom:20px; }
}

@media screen and (max-width:600px) {
  #header_slider .caption, #header_video .caption { padding:0 20px; }
  #header_slider_nav .slick-current, #header_slider_nav .item:hover { background:#fff; }
}

@media screen and (max-width:340px) {
#header_slider .caption .title br, #header_video .caption .title br, #header_youtube .caption .title br { display: none; }
}

/* スライダーナビゲーションリンク */
@media only screen and (max-width:991px){
#header_slider_nav .item { padding:10px 20px; }
#header_slider_nav .catch { font-size:14px; line-height:2; }
}


/* 動画 */
@media only screen and (max-width: 767px) {
	#header_slider_nav { position:static; }
	#header_video { min-width:0; }
}


/* Youtube 動画 */
@media only screen and (max-width: 767px) {
	#header_youtube { min-width:0; height: 400px; }
}


/* ３点ボックスコンテンツ */
@media only screen and (max-width:991px){
	#index_3box_list { display:block; width:100%; box-sizing: border-box; }
	#index_3box_list .box { width:auto; }
  #index_3box_list .box:not(:first-of-type) { margin-top: 20px;}
}
@media only screen and (max-width:767px){
#index_3box { width:auto; margin:40px auto; padding: 0 20px; }
#index_3box_header { padding:0 0;}
#index_3box_header .headline { font-size:26px !important; }
#index_3box_header .desc { text-align:left; font-size:14px!important; margin-bottom: 20px; }
#index_3box_list .box { position:relative; }
#index_3box_list .icon { margin:0 auto 20px; width: 140px; height: 140px;}
#index_3box_list .catch { margin-bottom:10px; }
#index_3box_list .desc { font-size: 14px; height:auto; overflow:none; margin:0 0 10px 0; }
}

@media screen and (max-width:550px) {
  #index_3box { width:100%; margin:40px auto; }
  #index_3box_list .box { margin:0 auto; position:relative; padding:28px 20px 20px; }
  #index_3box_list .icon { float:none; position:relative; }
  #index_3box_list .icon span:before { top:46px; left:144px; }
  #index_3box_list .catch { font-size: 20px; text-align:center; }
  #index_3box_list .link { position:relative; text-align:center; bottom: 0; }
}

/* ３点ボックスコンテンツの下の画像 */
@media only screen and (max-width:767px){
#index_center_image { margin:0 0 25px 0; }
}


/* ４点ボックスコンテンツ */
@media only screen and (max-width:767px){
#index_4box_list { flex-direction:column; }
#index_4box {
  width:auto; margin:0 auto 50px; padding:0 20px;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#index_4box_list .box { width:auto; margin:0 0 -1px 0; }
#index_4box_list .box.num1, #index_4box_list .box.num3 { border-right:1px solid #ddd; }
#index_4box_list .box.num3 { margin-bottom:-1px; }
#index_4box_list .box.num4 { margin-bottom:1px; }
#index_4box_list .box.num3 .image { float:left; margin:0 35px 0 0; }
#index_4box_list .box.num2 .image, #index_4box_list .box.num4 .image { float:right; margin:0 0 0 35px; }
}

@media screen and (max-width:550px) {
  #index_4box_list .box { height:auto; float:none; }
  #index_4box_list .box.num1, #index_4box .box.num3 { border-right:1px solid #ddd; }
  #index_4box_list .box a.link { padding:30px 20px; }
  #index_4box_list .box .image { float:none; margin:0 auto 35px; }
  #index_4box_list .box.num2 .image, #index_4box_list .box.num3 .image, #index_4box_list .box.num4 .image { float:none; margin:0 auto 35px; }
  #index_4box_list .box .catch { text-align:center; }
  #index_4box_list .box .desc { height:auto; overflow:none; }
}


/* 一覧の見出し */
@media only screen and (max-width:767px){
.index_list_header {
  width:auto; margin:0 auto 40px; padding:0 0;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
.index_list_header .headline { float:none; text-align:center; font-size:26px !important; }
/*.index_archive_link { display:none; }*/
.mobile_archive_link .index_archive_link { display:inline-block; float:none; }
.mobile_archive_link { text-align:center; margin:0 0 40px; }
.index_list_header .desc { font-size:14px; text-align: left; }
}

/* お知らせ一覧 */
@media only screen and (max-width:767px){
#index_news_list { width:auto; margin:50px auto; }
#index_news_list .mobile_archive_link { margin-top:20px;}
.news_list li { padding:10px; overflow: visible; }
.news_list .date { display:inline-block; float:none; margin:0 5px 0 0; line-height:1 !important; }
.news_list .category { display:inline-block; float:none; margin:0; padding: 0; line-height:20px; }
.news_list .title { font-size: 14px; float:none; clear:both; display:block; line-height:1.6; width:auto; margin-top: 10px !important; }
.news_list .title a { display:block; padding:0; line-height: 1.5; height: auto; }
.use_animation #index_news_list .mobile_archive_link .index_archive_link { opacity:0; }
.use_animation #index_news_list.animated .mobile_archive_link .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
.index_news_list_inner { padding-right:20px; padding-left:20px;}
}


/* ブログ一覧 */
@media only screen and (max-width:991px) {
	.blog_list {
	  display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
		-webkit-flex-wrap: wrap;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
		-webkit-box-pack: justify;
  	-ms-flex-pack: justify;
  	justify-content: space-between;
	}
	.blog_list .box {
		margin-right: 0;
		width: calc((100% - 20px) / 2); 
	}
}
@media only screen and (max-width:767px){
#index_blog_list { margin:0 auto 20px; width:calc(100% - 40px); }
#index_blog_list .blog_list { display:block; }
.blog_list .box {
  float:none; display:inline-block; vertical-align:top; height:auto; margin:0 0 20px 0;
	width:100%;
}
.blog_list .box .date { margin-left:10px; font-size:10px; }
.blog_list .box:nth-child(3n) { margin-right:20px; }
.blog_list .box:nth-child(2n) { margin-right:0px; }
.blog_list .box .image { height:auto; }
.blog_list .box .title a { height:auto; overflow:none; }
.use_animation #index_blog_list .mobile_archive_link .index_archive_link { opacity:0; }
.use_animation #index_blog_list.animated .mobile_archive_link .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
}

@media screen and (max-width:550px) {
  .blog_list { margin:0; }
  .blog_list .box { float:none; display:block; width:100%; height:auto; margin:0 0 20px 0; }
  .blog_list .box:nth-child(3n) { margin-right:0px; }
  .blog_list .box:nth-child(2n) { margin-right:0px; }
}


/* 料金システム表/機能比較表 */
@media only screen and (max-width:767px){
#index_price_function { width:initial; width: auto; margin:0 0 40px 0; padding:0 20px; }
.index_price_function + .index_price_function { margin-top:20px; }
}

/* フリースペース */
@media only screen and (max-width:1149px){
.index_free_content {}
}

@media only screen and (max-width:767px){
.index_free_content { width: 100%; margin-right: 0 !important; margin-left: 0 !important; padding: 0 20px; }
}

/* ----------------------------------------------------------------------
 大きな画像　トップページの中央画像、フッター画像、アーカイブページ上部など
---------------------------------------------------------------------- */
@media only screen and (max-width:767px){
.wide_image { min-height:160px; width:100%; min-width:0; position:relative; }
.wide_image .caption { width:auto; padding:40px 20px; }
.wide_image .caption .title { font-size:26px!important; }
.wide_image .caption .desc { text-align:left; }
.wide_image .caption .desc { font-size:14px!important;}
}



/* ----------------------------------------------------------------------
 制作実績一覧
---------------------------------------------------------------------- */
@media only screen and (max-width:991px){
  #index_work_list { width:calc(100% - 40px); margin:0 20px 40px; }
  #index_work_list #work_list_wrap { padding:0; margin-bottom:40px; }
  #work_list_wrap { box-sizing:border-box; padding:0 20px; width:100%; }
  .work_list { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .work_list .box { width:48%; margin:0 0 0 0; }
  .work_list .box:nth-child(n+3) { margin-top:20px; }
  .work_list .box .date { margin-bottom:0; }
  .use_animation #index_work_list .mobile_archive_link .index_archive_link { opacity:0; }
  .use_animation #index_work_list.animated .mobile_archive_link .index_archive_link {
    -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
    animation: opacityAnimation 1.0s ease forwards 1.0s;
  }
  .work_list .box .category { margin: 20px 20px 0; }
  .work_list .box .title a { padding:15px 10px; }
}

@media screen and (max-width:600px) {
  .work_list .box { float:none; width:100%; height:auto; padding-bottom:60px; }
  .work_list .box:not(:first-child) { margin-top:20px; }
  .work_list .box:nth-child(3n) { margin-right:0px; }
  .work_list .box:nth-child(2n) { margin-right:0px; }
  .work_list .box .title { font-size:14px; }
	.work_list .box .image { margin:75px auto 20px; width: calc(100% - 40px); }
	.work_list .box .catch { font-size:14px; margin:20px 20px 0; }
	.work_list .box .date { margin-left:20px; margin-right:20px; font-size:10px; }
}


/* カテゴリ―ボタン */
@media only screen and (max-width:767px){
#work_category_list { width:auto; margin:0 20px 40px; }
#work_category_list li { float:left; width:50%; height:80px; margin:0 -1px -1px 0; }
}
@media screen and (max-width:550px) {
  #work_category_list li { float:none; width:100%; margin:0 0 -1px 0; }
}




/* ----------------------------------------------------------------------
 製作実績ページ
---------------------------------------------------------------------- */
/* 見出し */
@media only screen and (max-width:767px){
#work_header { min-width:0; height:auto; }
#work_header_inner { width:auto; margin:0 auto; padding:15px 20px; display: block; }
#work_header .category { margin:0 0 10px 0; float:none; }
#work_header .title { margin:0; float:none; height:auto; line-height:1.8; }
}


/* 詳細ページ　下部 */
@media only screen and (max-width:767px){
#work_footer_data { padding:0; margin:0 0 40px 0; }
#work_footer_data .image {
  position:relative; top:0; left:0px; margin:0 auto 30px;
  -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);
}
#work_footer_data .data { margin:0; }
#work_footer_data .title { font-size: 20px; margin-bottom: 20px; }
#work_footer_data .title br {display: none;}
#work_footer_data .link { text-align:left; }
}


/* ボタン */
@media only screen and (max-width:767px){
#work_footer_data .link_button { margin:0 0 20px 0; text-align:center; }
}

/* 詳細ページ　ナビゲーション */
@media only screen and (max-width:767px){
#work_navigation a { font-size: 12px; height: 30px; line-height: 30px; }
#work_navigation a.prev { margin:0 4px 10px; padding:0 10px 0 20px; }
#work_navigation a.next { margin:0 4px; padding: 0 20px 0 10px; }
#work_navigation a.prev:before { font-size: 12px; top: 0; left: 5px;}
#work_navigation a.next:before { font-size: 12px; top: 0; right: 5px;}
}




/* ----------------------------------------------------------------------
 アーカイブページ
---------------------------------------------------------------------- */
@media only screen and (max-width:767px){
#page_header { margin:0 0 30px 0; }
#page_header .headline { font-size:24px !important; line-height:1.4; }
}


/* ページング */
@media only screen and (max-width:767px){
.page_navi { margin-bottom: 40px; }
}




/* ----------------------------------------------------------------------
 お知らせ
---------------------------------------------------------------------- */
@media only screen and (max-width:767px){
#archive_news_list  .news_list { margin:0 0 50px 0; }
#single_news { background:#f7f7f7; padding:20px; margin:0 0 30px 0; }
#single_news_list { margin:30px 0 30px 0; }
}



/* ----------------------------------------------------------------------
 ヘッダー
---------------------------------------------------------------------- */
/* PCのスタイルをリセット　iPadの回転対策 */
@media only screen and (max-width:1320px){
	.pc #header_logo #logo_text, .pc #header_logo #logo_image { width:auto; }
}


/* メニューボタン */
@media only screen and (max-width:1023px){
a.menu_button {
   position:absolute; right:0px; z-index:9;
   display:inline-block; font-size:11px; color:#333; width:56px; height:56px; line-height:56px; text-decoration:none; text-align:center;
}
a.menu_button span { text-indent:100%; white-space:nowrap; overflow:hidden; display:block; }
a.menu_button:before {
  font-family:'design_plus'; color:#333; display:block; position:absolute; top:0; bottom:0; left:0; right:0; margin:auto;
  font-size:18px; width:24px; height:24px; line-height:24px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
a.menu_button:before { content:'\f0c9'; }
a.menu_button:hover, a.menu_button.active { background:#50BE98; }
a.menu_button:hover:before, a.menu_button.active:before { color:#fff; }
}

/* グローバルメニュー */
@media only screen and (max-width:1023px){
#global_menu { display:none; clear:both; width:100%; margin:0; top:56px; position:absolute; z-index:9; box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 2px 1.5px rgba(0, 0, 0, 0.1); }
#global_menu ul { margin:0; }
#global_menu ul ul { display:none; }
#global_menu a {
  position:relative; display:block;  margin:0; padding:0px 15px; height:50px; line-height:50px; overflow:hidden; text-decoration:none;
  color:#fff !important; background:#333; font-size:13px;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#global_menu a:hover { color:#fff; }
#global_menu ul ul a { padding-left:28px; background:#222; }
#global_menu ul ul ul a { padding-left:42px; background:#111; }
#global_menu ul ul ul ul a { padding-left:55px; background:#000; }
#global_menu li.menu-item-has-children { position:relative; }
#global_menu .child_menu_button { display:block; position:absolute; text-align:center; width:60px; height:49px; right:0px; top:1px; z-index:9; cursor:pointer;  }
#global_menu .child_menu_button .icon:before {
  content:'+'; font-size:13px; color:#aaa; text-align:center;
  display:block; width:20px; height:20px; line-height:20px; border:1px solid #555; border-radius:100%;
  position:absolute; left:20px; top:15px;
}
#global_menu .child_menu_button.active .icon:before, #global_menu .child_menu_button:hover .icon:before { color:#fff; border-color:#fff; }
#global_menu li.menu-item-has-children.open > .child_menu_button .icon:before { content:'-'; }
#global_menu li.menu-item-has-children.open > ul { display:block; }
}

@media screen and (max-width: 1023px) {
  #global_menu {
    display: none;
  }
  .menu_button {
    display: inline-block;
  }
  .gnavi_category ul {
    width: auto;
    column-count: 1;
    background-color: initial;
  }
}

@media screen and (min-width:1024px) {
#global_menu a {
  font-size: 14px; /* 必要に応じて調整 */
  padding: 0 10px;
}
#global_menu {
  display: block !important;
}
.menu_button {
  display: none !important;
}

/* グローバルメニュー */
.mobile #global_menu { float:right; }
.mobile #global_menu > ul { height:90px; font-size:0; position:relative; margin-right: 20px; }
.mobile #global_menu > ul > li { font-size:1%; position:relative; display:inline-block; }

.mobile #global_menu > ul > li > a {
  font-size:14px; text-decoration:none; height:90px; line-height:90px; display:block; padding:0 15px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; font-feature-settings: "palt"; letter-spacing: .03rem;}
.mobile #global_menu > ul > li > a:hover { color: #50BE98 !important; }

.mobile #global_menu ul ul { display:none; width:230px; position:absolute; top:90px; left:10px; margin:0; padding:0; }
.mobile #global_menu ul ul ul { left:100%; top:0; margin:0; border:none; }
.mobile #global_menu ul ul li { line-height:1.5; padding:0; margin:0; text-align:left; position:relative; display:block; }
.mobile #global_menu ul ul a { display:block; font-size:14px; border:none; position:relative; padding:15px 20px 14px 20px; height:auto; line-height:1.6; margin:0; text-align:left; box-shadow:none; background-color: #333 !important; color: #fff !important; font-feature-settings: "palt"; letter-spacing: .05rem; }
.mobile #global_menu ul ul a:hover { text-decoration:none; border:none; color: #333 !important; background-color: #F7E900 !important; }

.mobile #global_menu ul ul li.menu-item-has-children > a:before { margin:0; display:block; top:20px; right:10px; position:absolute; content:""; width:0; height:0; border-style:solid; border-width:4px 0px 4px 4px; border-color:transparent transparent transparent #fff; }
.mobile #global_menu li li.current-menu-item > a {  }
.mobile #global_menu ul li.menu-item-has-children a:after {
  content: "";
  margin-left: 5px;
  margin-bottom: -3px;
  border: 5px solid transparent;
  border-top: 8px solid #333;
  display: inline-block;
}
.mobile #global_menu ul li.menu-item-has-children .sub-menu li a:after {
display: none;}

/* ヘッダーボタン */
.header_contact {
  height: 100%;
  float: right;
  display: flex;
}
.header_contact li {
  width: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  text-align: center;
  font-feature-settings: "palt";
  letter-spacing: .03rem;
}
.header_contact li:first-of-type {
  background-color: #F3F3F3;
}
.header_contact li .tel_num {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 5px;
  display: block;
  vertical-align: middle;
}
.header_contact li .tel_num:before {
  content: "";
  display: inline-block;
  background: url(https://mvsk.jp/wp-content/themes/source_tcd045/img/common/tel_gry.svg);
  background-size: 16px;
  width: 16px;
  height: 16px;
  margin-right: 3px;
}
.header_contact li .tel_data {
  font-size: 10px;
}
.header_contact li:nth-of-type(2) a {
  color: #fff !important;
  font-size: 20px;
  font-weight: bold;
  background-color: #50BE98;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.header_contact li:nth-of-type(2) a:hover {
  color: #333 !important;
  background-color: #F7E900;
  text-decoration: none;
}

.header_contact .tel_pc {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.header_contact .tel_pc a {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}
.header_contact .tel_pc a::before {
  content: "";
  display: block;
  background: url(https://mvsk.jp/wp-content/themes/source_tcd045/img/common/tel_gry.svg);
  background-size: 40px;
  width: 40px;
  aspect-ratio: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.header_contact .tel_pc span {
  display: none;
}
.header_contact .mail_pc a {
  position: relative;
}
.header_contact .mail_pc a::before {
  font-family: 'design_plus';
  content: '\f0e1';
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff !important;
  font-size: 100%;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #333;
  border-radius: 50%;
  width: 40px;
  aspect-ratio: 1;
}
.header_contact .mail_pc span {
  display: none;
}
}

@media screen and (min-width:1320px) {
.header_contact li {
  width: 190px;
}
.header_contact .tel_pc span,
.header_contact .mail_pc span {
  display: block;
}
.header_contact .tel_pc a,
.header_contact .tel_pc a::before,
.header_contact .mail_pc a::before {
  display: none;
}
}

/* ロゴ */
@media only screen and (max-width:1320px){
#logo_text { margin:0 0 0 15px; z-index:10; float:left; text-align:left; width:-webkit-calc(100% - 90px); width:-moz-calc(100% - 90px); width:calc(100% - 90px); overflow:hidden; }
#logo_text h1 { font-weight:normal; height:56px; line-height:56px; }
#logo_text a { text-decoration:none; display:block; -webkit-transition-property:none; -moz-transition-property:none; -o-transition-property:none; transition-property:none; }
#logo_text a:hover { text-decoration:underline; }
#logo_image { position:absolute; top:50%; left:15px; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); width: 100px; }
#logo_image img { width: 100px; }
#logo_image img.pc_logo_image { display:none; }
#logo_image img.mobile_logo_image { display:block; }
#logo_text_fixed, #logo_image_fixed { display:none; }
}

/* パンくずリンク */
@media only screen and (max-width:767px){
#bread_crumb {
  font-size: 10px;
  margin:0;
  height:auto;
  line-height:1.6;
  min-width:0px;
  padding:10px;
}
#bread_crumb ul { width:auto; margin:0 auto; }
#bread_crumb li.home a:before { top:5px; left:0px; }
#bread_crumb li:after { top:2px; }
.bread_crumb_inner { width: 100%; margin: 0;}
}

/* ヘッダーボタン */
@media only screen and (max-width:1023px){
.header_contact {
  display: none;
}
}



/* ----------------------------------------------------------------------
 記事ページ
---------------------------------------------------------------------- */
/* 記事タイトル */
@media only screen and (max-width:767px){
#post_meta_top {margin-top:0;}
#post_meta_top .date { line-height:30px; margin: 0 10px; font-size:10px; }
#post_title { font-size:24px !important; line-height:1.4; margin:0 0 20px; }
#post_image { margin-bottom:15px; }
}



/*  記事本文*/
@media only screen and (max-width:767px){
.post_content { font-size: 14px ; margin:0; }
}


/* SNSボタン */
@media only screen and (max-width:767px){
#single_share_top { margin:-5px 0 10px; }
#single_share_top #share_top1 { padding-top:0; }
}


/* メタ情報 */
@media only screen and (max-width:767px){
#post_meta_bottom { margin:0 0 20px 0; background:#fff; padding:0; }
#post_meta_bottom li { display:block; margin:0 0 10px 0; border:none; font-size:12px; line-height:1.6; }
#post_meta_bottom li:last-child { border:none; margin:0; }
#post_meta_bottom li.post_category:before { top:0px; left:0px; }
#post_meta_bottom li.post_tag:before { top:2px; left:0px; }
#post_meta_bottom li.post_author:before { top:0px; left:0px; }
#post_meta_bottom li.post_comment:before { top:0px; left:0px; }
}


/* 次の記事、前の記事 */
@media only screen and (max-width:767px){
#previous_next_post { margin:0 0 30px 0; }
#previous_next_post .prev_post, #previous_next_post .next_post { width:50%; }
#previous_next_post .prev_post { margin-bottom:-1px; }
#previous_next_post a { height:auto; text-align:center; height:50px; line-height:50px; }
#previous_next_post .prev_post a::before { line-height:50px; height:50px; }
#previous_next_post .next_post a::before { line-height:50px; height:50px; }
#previous_next_post a span { height:auto; }
#previous_next_post span.nav { display:block; }
#previous_next_post span.title { display:none; }
#previous_next_post .prev_post span.nav { margin-left:-35px; }
#previous_next_post .next_post span.nav { margin-right:-35px; }
}


/* 広告 */
@media only screen and (max-width:991px) {
#single_banner_area { margin:0 0 15px 0; text-align:center; }
#single_banner_area .single_banner_left { float:none; padding:0 0 15px 0; margin:0 auto; }
#single_banner_area .single_banner_right { float:none; padding:0 0 15px 0; margin:0 auto; }
#single_banner_area img { max-width:100%; height:auto; display:inline; }
}


/* 広告2 */
@media only screen and (max-width:991px) {
#single_banner_area_bottom { margin: -20px 0 0; text-align:center; }
#single_banner_area_bottom .single_banner_left { float:none; padding:0 0 15px 0; margin:0 auto; }
#single_banner_area_bottom .single_banner_right { float:none; padding:0; margin:0 auto; }
#single_banner_area_bottom img { max-width:100%; height:auto; display:inline; }
}


/* 広告（ショートコードver） */
@media only screen and (max-width:991px) {
#single_banner_area2 { margin:0 0 15px 0; text-align:center; }
#single_banner_area2 .single_banner_left { float:none; padding:0 0 15px 0; margin:0 auto; }
#single_banner_area2 .single_banner_right { float:none; padding:0 0 5px 0; margin:0 auto; }
#single_banner_area2 img { max-width:100%; height:auto; display:inline; }
}


/* 関連記事 */
@media only screen and (max-width:767px){
#related_post .headline { height:45px; line-height:45px; margin-bottom:15px; }
#related_post { overflow:hidden; }
#related_post ol { margin-right:-15px; }
#related_post li, #related_post li:nth-child(4n) {
  width:33.33333%; width:-webkit-calc(100% / 3 - 15px); width:-moz-calc(100% / 3 - 15px); width:calc(100% / 3 - 15px);
  margin:0 15px 15px 0;
}
#related_post li:nth-child(3n) { margin-right:0; }
#related_post li .image { margin:0 0 15px 0; display:block; width:100%; height:auto; }
#related_post li .image img {
  /* スマホではhoverが効かないためアニメーションは無効にして、height:auto;が有効になるように以下を設定する */
  width:100% !important; height:auto !important;
  -webkit-transform:none !important; -webkit-transition-property:none !important; -webkit-transition:0 !important;
  -moz-transform:none !important; -moz-transition-property:none !important; -moz-transition:0 !important;
  -ms-transform:none !important; -ms-transition-property:none !important; -ms-transition:0 !important;
  -o-transform:none !important; -o-transition-property:none !important; -o-transition:0 !important;
  transform:none !important; transition-property:none !important; transition:0 !important;
}
}
@media screen and (max-width:550px) {
  #related_post ol { margin-right:-15px; }
  #related_post li, #related_post li:nth-child(4n) {
    width:50%; width:-webkit-calc(50% - 15px); width:-moz-calc(50% - 15px); width:calc(50% - 15px);
    margin:0 15px 15px 0;
  }
  #related_post li:nth-child(3n) { margin-right:15px; }  
}



/* ----------------------------------------------------------------------
 コメント
---------------------------------------------------------------------- */
@media only screen and (max-width:767px){
#comment_headline { margin:0 0 15px 0; }
#comment_area, #trackback_area { margin:15px 0px 0; }
}


/* コメント・トラックバックのタブ */
@media only screen and (max-width:767px){
#comment_header { position:relative; margin:0 0 15px; }
#comment_header ul { margin:0; }
#comment_header ul li.comment_switch_active a:after, #comment_header #comment_closed p:after { display:none; }
}
@media screen and (max-width:500px) {
  #comment_header ul li { float:none; text-align:center; margin:0; width:100%; }
}


/*  コメントの基本部分 */
@media only screen and (max-width:767px){
.comment { padding:10px 10px 0; }
}


/* コメントの情報部分 */
@media only screen and (max-width:767px){
.comment-meta-left { float:left; width:100%; }
}


/* フォーム部分 */
@media only screen and (max-width:767px){
.comment_form_wrapper { border:1px solid #ccc; margin:0 0 25px; padding:15px; background:#fff; }
}




/* ----------------------------------------------------------------------
 フッター
---------------------------------------------------------------------- */
/* フッター上部 */
@media only screen and (max-width:767px){
#footer_top { min-width:0; }
#footer_top_inner { width:auto; padding:40px 20px 0; }
}

/* widget */
@media only screen and (max-width:991px){
  #footer_widget { margin:50px 20px; width:auto; font-size:0; text-align:left; }
}

/* メニュー */
@media only screen and (max-width:991px){
  #footer_menu {
    grid-template-columns: repeat(2, 1fr);
    text-align: left;
    gap: 40px;
  }
  #footer_menu ul,
  #footer_menu ul:last-child {
    display: block;
    vertical-align: top;
    text-align: left;
  }
  #menu-footer_logo_area {
    grid-column: 1 / -1;
  }
  #menu-footer_logo_area .logo img {
    width: 200px;
    display: block;
    margin: 0 auto;
  }
}


/* 住所 */
@media only screen and (max-width:767px){
#footer_address { margin:0 20px; text-align:center; border-top:1px dotted #ccc; padding-top:40px; }
#footer_address .info { font-size:12px; }
#footer_address li { display:block; margin:0; }
}


/* フッター下部 */
@media only screen and (max-width:1190px) {
#footer_bottom { padding-bottom: 60px; }
}

@media only screen and (max-width:767px){
#footer_bottom { width:auto; min-width:0; height:auto; }
#footer_bottom_inner { width:auto; height:auto; }
#footer_bottom a { }
}


/* SNSボタン */
@media only screen and (max-width:767px){
#footer_social_link { position:relative; left:0px; right:0; margin:auto; top:0px; background:#F7E900; text-align:center; padding:0 0 0 0; }
#footer_social_link li { float:none; display:inline-block; margin:0 2px; }
}


/* ページ上部へ戻るボタン */
@media only screen and (max-width:767px){
#return_top {display: none;}
/*#return_top {
  position:fixed; right:0px; bottom:0px; z-index:999;
  -webkit-transform: translate3d(0,120%,0); transform: translate3d(0,120%,0);
  -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s;
}
#return_top.active { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
#return_top a { position:relative; display:block; height:60px; width:60px; text-decoration:none; border-radius:0; }
#return_top span { text-indent:100%; white-space:nowrap; overflow:hidden; display:block; }
#return_top a:before {
  font-family:'design_plus'; color:#fff; font-size:18px; display:block; position:absolute; width:23px; height:23px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#return_top a:before { content:'\e911'; top:22px; left:21px; }
}*/


/* フッターナビ */
/*
@media only screen and (max-width:767px){
.dp-footer-bar { display:table; }
}
*/

/* 固定フッターが有効時、モバイルデバイス調整用 */
/*
@media only screen and (max-width:767px){
body.mobile_device { padding-bottom:65px; }
body.mobile_device #return_top.active { -webkit-transform: translate3d(0,-65px,0); transform: translate3d(0,-65px,0); }
}
*/



/* ----------------------------------------------------------------------
 サイドコンテンツ
---------------------------------------------------------------------- */
/* 基本設定 */
@media only screen and (max-width:767px){
.side_headline { text-align:center; }
.side_widget { margin:0 0 25px 0; font-size:12px; position:relative; }
.side_widget:last-child, .side_widget:only-child  { margin:0; }
}

/* search */
@media only screen and (max-width:767px){
.widget_search #search-box, .widget_search #s, .side_widget.google_search #s { width:75%; height:40px; margin:0 0 5px 0; }
.widget_search #search-btn input, .widget_search #searchsubmit, .side_widget.google_search #searchsubmit { width:25%; }
}


/* プロジェクト */
@media only screen and (max-width:767px){
.work_list_widget li, .footer_widget .work_list_widget li {
  margin:0 5px 5px 0 !important; width:auto; height:auto;
  width:-webkit-calc(100% / 3 - 5px); width:-moz-calc(100% / 3 - 5px); width:calc(100% / 3 - 5px);
}
.work_list_widget .image { width:100% !important; height:auto !important; }
.work_list_widget .image img {
  /* スマホではhoverが効かないためアニメーションは無効にして、height:auto;が有効になるように以下を設定する */
  width:100% !important; height:auto !important;
  -webkit-transform:none !important; -webkit-transition-property:none !important; -webkit-transition:0 !important;
  -moz-transform:none !important; -moz-transition-property:none !important; -moz-transition:0 !important;
  -ms-transform:none !important; -ms-transition-property:none !important; -ms-transition:0 !important;
  -o-transform:none !important; -o-transition-property:none !important; -o-transition:0 !important;
  transform:none !important; transition-property:none !important; transition:0 !important;
}
}