@charset "UTF-8";
/*
Theme Name:   THE SONIC Child
Theme URI:    https://the-sonic.jp
Description:  THE SONICカスタマイズ用子テーマ
Author:       SONIC Team
Author URI:   https://the-sonic.jp
Template:     thesonic
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/

/*
* ここから下に記述
*/

/* ************************************ *
 * SONICテーマのCSS調整
 * ************************************ */
/* リスト調整 */
ul.nav_inner,
ul.nav_inner li,
.footer_banner ul,
.footer_wapper ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tel_box_wrapper ol,
.top_service_list li,
.footer_banner ul li,
.footer_sns li {
	list-style: none;
}

.top_service_list,
.footer_sns,
.footer_wapper ul {
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
}

/* footerの背景色 */
footer {
	background-color: #fff !important;
}

/* pタグ調整 */
.case_list_txt p {
  margin-bottom: 0;
}

.another_service_inner p,
footer p {
  margin-bottom: 0;
  line-height: 1em;
}

/* 目次調整 */
.mkj-content-in {
  padding-left: 70px;
}

/* コラム記事の余白削除 */
.entry-letterbody .contents_box,
.entry-letterbody .info_contents_wrapper {
	padding-top: 0;
}
.entry-letterbody #content　{
	margin-top: 0;
}

/* iframeのなぞCSS削除 */
.responsive_iframe {
  padding: 0;
  width: auto;
}
.responsive_iframe iframe {
  position: static;
  width: 50%;
}

@media (max-width: 750px) {
  .header_logo a {
    line-height: 1;
  }

  .sp_icon {
    margin-top: -15px;
    padding: 0;
  }
}

/* 会社概要 */
.company_box table,
.company_box table th,
.company_box table td {
	padding: 0;	
	border: none;
}

.company_box table th {
	background-color: #fff;
	color: #333;
	font-weight:bold;
}

.company_box table td {
	text-align: left;
}

/* コラム */
.main-in,
.main-in .entry-content {
	padding-left: 0;
	padding-right: 0;
}

.main-in .entry-content .news_content_ttl {
	margin-top: 1em;
}

.breadcrumbs { display:flex; font-size:12px; flex-wrap:nowrap; margin:0 0; padding:0 0; width:100%; overflow:hidden;}
.breadcrumbs li { flex:0 0 auto;}
.breadcrumbs li:last-child { flex:1 1 auto; overflow:hidden;}
.breadcrumbs a::after { content: "\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 600; margin: 0 8px; opacity: .38;}
.breadcrumbs span { text-overflow:ellipsis; white-space: nowrap; overflow:hidden; width:100%; display:block;}

/* お問い合わせ */
.form_wrapper table,
.form_wrapper td,
.form_wrapper th {
	text-align: left;
}

/* sm231103SP崩れ急ぎ調整 */
@media (max-width: 750px){
	header{top:0;}
	header .sp_icon{margin-top:-33px;}
	header .active ul li{list-style: none;}
	header .smt_menu{padding:0;}
	.hero_image{padding-top:30px;}
	.info_contents ul{padding-left:0;}
	.company_box{padding-left:20px;padding-right:20px;}
	.responsive_iframe iframe{width:100%}
}

/* ************************************ *
 * 元テーマのCSS調整
 * ************************************ */
/* サービス一覧の余白調整 */
.another_service {
	padding-left: 0;
}

/* お問い合わせフォームのCSS調整 */
.form_wrapper table {
	margin-bottom: 24px;
}

.form_wrapper table tr.name th {
	box-sizing: border-box;
}
.readtext p{
	text-align:center;
	margin-top:10px;
}

/*** 2025-4-23column-box ***/
.column-box{
  max-width: 700px;
  height:300px;
  display: flex;
  align-items: center;
  border: solid 1px #2589d0;
  margin:5px auto;
  padding:5px 10px 10px 10px;
}
.column-box img{
  width:50%;
  height: 50%;
}
.column-box p{
  font-size: 14px;
}
.button-30 {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 200px;
  margin:0 auto;
  padding: .9em 2em;
  border: 1px solid #2589d0;
  border-radius: 5px;
  background-color: #fff;
  color: #2589d0;
  font-size: 1em;
}

.button-30:hover {
  animation: anima-button-30 1s;
}

@keyframes anima-button-30 {
  0% {
      box-shadow: 0 0 0 0 rgb(37 137 208 / 50%);
  }
  100% {
      box-shadow: 0 0 0 1.2em rgb(0 0 0 / 0%);
  }
}

/* スマートフォン用のスタイル */
@media screen and (max-width: 768px) {
  .column-box {
    width: 80%;
    height: auto;
    flex-direction: column;
    padding: 10px;
  }

  .column-box img {
    width: 60%;
    height: auto;
    margin: 0 auto 10px;
  }

  .button-30 {
    width: 80%;
    font-size: 0.9em;
  }
}


/*** 2025-03-19 ***/
.main_nav li { position:relative; line-height:1.2;}
.main_nav li:hover > a,
.main_nav li:focus-within > a { font-weight:bold;}
.main_nav li .menu_children { display:none; padding:12px 0 0; background:rgba(255,255,255,0.95); box-shadow:0 2px 8px rgba(0,0,0,0.2); width:440px;}
.main_nav li:hover .menu_children,
.main_nav li:focus-within .menu_children { display:block; position:absolute; top:calc(100% - 5px); left:0;}
.main_nav li:hover .menu_children li { padding:0 16px 12px; margin:0 0;}
.main_nav li:hover .menu_children li a { font-size:13px;}
.main_nav li:hover .menu_children li a::before { content:"- ";}

.main_nav_list { display:flex; justify-content:end; margin:0 0; padding:0 0;}
.main_nav_list > li { padding:5px 5px; margin:0 0;}
.main_nav_list > li > a { display:block; padding:20px 10px; font-size:16px; line-height:1.2;}

/** 2025-05-21 **/
nav.pc_none_header { height:100%;}
nav.pc_none_header .sp_icon { margin:0!important; padding-right:52px;}
.navToggle { margin:0!important;}
.sp_icon a img { width:100%; height:auto;}
@media screen and (min-width: 450px) {
nav.pc_none_header { height:70px!important;}
nav.pc_none_header .sp_icon { height:70px; padding-right:68px;}
.sp_icon a { display:flex; align-items:center; width:40px; margin:0 4px;}
}
@media screen and (min-width: 750px) {
	.header_logo a { line-height:1;}
	nav.pc_none_header .sp_icon { display:flex; justify-content:end;}
}
@media screen and (min-width: 970px) {
	nav.pc_none_header .sp_icon { height:100px; padding-right:88px;}
	.sp_icon a { width:48px; margin:0 5px;}
}
@media screen and (min-width: 1128px) {
	.header_logo a { margin-left:12px;}
	nav.pc_none_header .sp_icon { display:none;}
}

@media screen and (min-width: 970px) {
	.another_service_inner img {
		width: 255px;
	}
	.another_service_txtinner h4 {
		font-size: 20px;
	}
}
@media screen and (min-width: 1200px) {
	.another_service_txtinner h4 {
		font-size: 25px;
	}
}

/** 2025-05-21 **/
input.verification_btn { margin-bottom:16px;}

#content article > h2 { color:#fff; background-color:#2d509b; margin:2em 0 1em; line-height:1.4; padding:8px 12px;}
#content article > h3 { padding:8px 0 8px 16px; border-left:solid 4px #2d509b;}