@charset "utf-8";

/*メディアクエリー
PC
@media (min-width: 768px) {}
タブレット
@media (min-width: 768px) and (max-width: 1024px) {}
*/

body { font-family: 'Zen Kaku Gothic New', sans-serif; font-weight: 400; font-style: normal; font-size:16px; line-height:28px; overflow-x: hidden;}

@media screen and (min-width: 768px) {
  main { margin-top:0px; }
}

/*PCスマホ表示切り替え用*/
.br_pc {display: none !important;}
.pc {display: none;}
.sp {display: block;}
.inline_sp { display:inline; }
.inline_pc { display:none; }
@media screen and (min-width: 768px) {
    .sp {display: none !important;}
    .pc {display: block;}
    .br_sp {display: none !important;}
    .br_pc {display: inline !important;}
    .inline_sp { display:none; }
    .inline_pc { display:inline; }
}


/*ページ*/
.contents_wrap { width:100%; }
.contents { width:90%; margin:0 auto;}
.contents.nopadding { width:90%; margin:0 auto; padding:0;}

@media screen and (min-width: 768px) {
  .contents { width:90%;}

}
@media screen and (min-width:1280px) {
  .contents_wrap .contents { width:1100px; margin:0 auto; }
  .contents.nopadding { width:1036px; }
}



/*フォント*/
p,strong,span,small { display:inline-block; }
.bold { font-weight:700; }
/*.contents p { text-align: justify;}*/
@media screen and (max-width: 768px) {
  p { line-height:1.7em; }
}
p { line-height:2em; letter-spacing:0.05;}

/*色_フォント*/
.color_w { color:#fff; }
.color_b { color:#000; }
.color_blue { color:#137CD3; }


/*色_背景*/
.back_white { background:#FFFFFF; }
.back_gray { background:#F5F5F5; }
.back_blue { background:#137CD3; }
.back_lightorange { background:#F7D499; }
.back_yellow { background:#FDF400; }
.back_lightblue { background:#EBF6FF; }


/*フォント_位置*/
.text_center { width:100%; text-align:center; display:inline-block; }
.text_left { width:100%; text-align:left; display:inline-block; }
.text_right { width:100%; text-align:right; display:inline-block; }

/*フォント_サイズ*/
h1 { font-size:28px; line-height:1.32em; }
.title_english { font-size:22px; }
.text-ll { font-size:28px; line-height:33px; }
.text-l { font-size:22px; line-height:33px; }
.text-22 { font-size:22px; line-height:36px; }
.text-m { font-size:16px; line-height:28px; }
.text-normal { font-size:14px; line-height:24.5px; }
@media screen and (min-width: 768px) {
  h1 { font-size:32px; line-height: 1.5em; }
  .title_english { font-size:109px; }
  .text-ll { font-size:32px; line-height:1.7em; }
  .text-l { font-size:24px; line-height:36px; }
  .text-22 { font-size:22px; line-height:36px; }
  .text-m { font-size:18px; line-height:31.5px; }
  .text-normal { font-size:16px; line-height:28px; }
  .text-s { font-size:14px; line-height:1.7em; }
  .text-xs { font-size: 12px; }
}

.letterspace1 { letter-spacing:0.1em; }
.letterspace05 { letter-spacing:0.05em; }


/*マージン*/
.margin-bottom32 { margin-bottom:32px; }
.margin-bottom40 { margin-bottom:40px; }

/*見出し文章*/
.lead { margin-bottom:48px; }
.lead_medium { width:100%; }
@media screen and (min-width: 768px) {
  .lead_medium { width:80%; margin:0 auto 80px auto; display:block; }
}

/*下層ページのタイトルまわり*/
.lowerpage_title_wrap {height: 230px;display: flex;align-items: center;background: url(/img/bg_title_sp.jpg) no-repeat left center;background-size: 0% 100%;background-repeat: no-repeat;animation: bgExpand 0.5s ease-out forwards;margin-bottom: 40px; overflow:hidden; }

/* アニメーション定義 */
@keyframes bgExpand {
  from {
    background-size: 0% 100%;
  }
  to {
    background-size: 100% 100%;
  }
}
@media screen and (min-width: 768px) {
.lowerpage_title_wrap { overflow:visible; }
}

.lowerpage_title_wrap .contents { width:95%; margin-left:5%; display:flex; align-items: center;}
.lowerpage_title_wrap .lowerpage_title { display:flex; flex-wrap:wrap; }
.lowerpage_title_wrap .lowerpage_title .h1_wrap { width:auto; color:#fff; position:relative; z-index:1; }
.lowerpage_title_wrap .lowerpage_title .h1_wrap .title_english { font-weight:bold; letter-spacing:0.1em; color:rgba(255, 255, 255, 0.3); }
.lowerpage_title_wrap .lowerpage_title .h1_wrap h1 { margin-bottom:5px;  }
.lowerpage_title_wrap .contents .img_title { width:55%; position:absolute; right:0; }
@media screen and (min-width: 768px) {
  .lowerpage_title_wrap {height: 265px;display: flex;align-items: center;background: url(/img/bg_title_pc.jpg) no-repeat left center;background-size: 0% 100%;background-repeat: no-repeat;animation: bgExpand 0.5s ease-out forwards;margin-bottom: 40px;}
  .lowerpage_title_wrap .contents { width:95%; margin-left:5%; }
  .lowerpage_title_wrap .lowerpage_title .h1_wrap .title_english  { font-size:109px; line-height:1.2em; }
  .lowerpage_title_wrap .lowerpage_title .h1_wrap h1 { position:absolute; top:40%; }
  .lowerpage_title_wrap .contents .img_title { width:40%; }
}
@media screen and (min-width:1100px) {
  .lowerpage_title_wrap { margin-bottom:90px; }
  .lowerpage_title_wrap .contents { width:1100px; height:100%; margin:0 auto; position:relative; }
  .lowerpage_title_wrap .contents .img_title { width:auto; height:296px; }
}

/*会社概要ページなどの表組み*/
.infolist { width:100%; display:flex; justify-content:space-between; flex-wrap:wrap; }
.infolist dt { width:100%; line-height:40px; padding: 0 20px; margin-bottom:10px; border-radius:8px; background:#EFA734;  }
.infolist dd { width:100%; line-height:1.75; padding: 0 20px; margin-bottom:25px;}
@media screen and (min-width: 768px) {
  .infolist { margin: 48px 0; }
  .infolist dt { width:20%; height: auto; line-height:1.75; margin-bottom:3px; padding: 20px 40px; }
  .infolist dd { width:78%; height: fit-content; line-height:1.75; margin-bottom:3px; padding: 20px 32px; border-bottom:1px solid #BFBFBF; align-self: start; }
  .infolist dd:nth-child(2) { border-top:1px solid #BFBFBF; }
}

/*矢印ボタン*/
.button_arrow { width: 52px; height: 28px; display: inline-block; transform: translate(-2px, 0px); background: #fff; border: 1px solid #000; border-radius: 9999px; box-shadow: 2px 2px; transition: all 0.1s; }
.button_arrow.long { width: 160px; height:28px; display: flex; align-items: center; justify-content: center; padding-left: 20px; margin: 0;transform: translate(-2px, 0px); background: #fff; border: 1px solid #000; border-radius: 9999px; box-shadow: 2px 2px; transition: all 0.1s; }
.arrow { display: block; width: 32px; margin: 5px auto; }
.button_arrow:hover { transform: translate(2px, 2px); box-shadow: none; }
.button_arrow.long:hover { transform: translate(2px, 2px); box-shadow: none; }

.hov_buttonback_orange:hover .button_arrow { background:#EFA734; }
.hov_buttonback_yellow:hover .button_arrow  { background:#F3CF5E; }
.hov_buttonback_lightyellow:hover .button_arrow  { background:#F8E5A6; }
.hov_buttonback_blue:hover .button_arrow  { background:#AECFED; }
.hov_buttonback_pink:hover .button_arrow  { background:#F19CA6; }
.hov_buttonback_green:hover .button_arrow  { background:#A4D3AC; }

/*リンク付き画像ホバーでズーム*/
/*画像外側にサイズとボーダーを指定する（サイズが幅相対ならaspect-ratioが便利？）*/
.hov_zoom .hov_img_frame { width: 100%; height: 100%; transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1); will-change: transform; }
.hov_zoom:hover .hov_img_frame { transform: scale(1.15); }


/*もっと見る*/
.button_more { width:100%; height:70px; border-radius:35px; background:#137CD3; border:1px solid #137CD3; display:flex; align-items:center; text-align:justify; justify-content: center; position:relative;  transition: background 0.4s ease, color 0.4s ease;}
.button_more:hover { background:#fff; border:1px solid #137CD3; }
.button_more:hover em {color:#137CD3;  }
.button_more:hover span.arrow_more {border:1px solid #137CD3;  }
.button_more em { font-size:18px; letter-spacing:0.05em; font-weight:bold; color:#fff; font-style:normal; }
.button_more span.arrow_more { width:25px; height:25px; border-radius:50%; border:1px solid #fff; display:flex; align-items: center; text-align: justify; justify-content: center; position:absolute; right:20px; }
.button_more span.arrow_more img { width:3px; }
.button_more.center { width:90%; margin:0 auto; } 
@media (min-width: 768px) {
  .button_more { width:350px; }
  .button_more.center { width:350px; }

  
}


/* デフォルトは有効（スマホ想定） */
@media (min-width: 768px) {
  .tel-link {
    pointer-events: none;  /* クリック無効化 */
    color: inherit;        /* リンク色を通常の文字と同じにする（お好みで） */
    text-decoration: none; /* 下線も消す（お好みで） */
    cursor: default;       /* マウスカーソルもリンク風にしない */
  }
}

/*共通問い合わせ*/

.contents_wrap.contact { width:100%; background:url(/img/bg_contact_sp.jpg); background-size:cover; background-repeat:none;   display:block; margin-top:80px; padding-bottom:40px; }
@media (min-width: 768px) {
  .contents_wrap.contact { background:url(/img/bg_contact_pc.jpg);padding-bottom:40px; }

}
.contents_wrap.contact .contents{ width:90%; display:flex; flex-wrap:wrap; }
.contact_wrap { width:100%; }
.contact_wrap strong { width:100%; font-size:22px; text-align:center; font-weight:bold; color:#fff; padding:40px 0 20px 0; letter-spacing:0.05em;}
.contactinfo { width:100%;  color:#fff; margin:0 auto; }
.contactinfo li { width:100%; }
.contactinfo li:nth-child(1) { margin-bottom:20px; }
.contactinfo li:nth-child(1) dl { background:#fff; height:56px; border-radius:28px; }
.contactinfo dl { display:flex; align-items:center;}
.contactinfo dl.inline_pc { display:none; }
.contactinfo dl dt  { width:auto; flex:1; margin-right:10px; }
.contactinfo dl dd { width:auto; }
.contactinfo dl dd span { font-size:30px; font-weight:bold; letter-spacing:0.1em; display:inline-block; line-height:1.2; color:#137CD3; }
.contactinfo dl dd small {line-height:1.2; }
@media (min-width: 768px) {
  .contactinfo { width:90%; }
  .contactinfo dl.inline_pc { display:flex; }
  .contactinfo dl dd small { display:inline-block; }
  .contactinfo li:nth-child(1) dl { background:none; }
  .contactinfo dl dd span { color:#fff; }
}

.button_tel { width:100%; height:65px; border-radius:32.5px; background:#F56745; display:flex; align-items:center; text-align:justify; justify-content: center; }
.button_tel em { font-size:20px; letter-spacing:0.05em; font-weight:bold; color:#fff; font-style:normal; margin-left:10px; }
.button_tel span { width:40px; height:40px; border-radius:50%; border:1px solid #fff; display:flex; align-items: center; text-align: justify; justify-content: center;}
.button_tel span img { width:20px; }

.button_contact { width:100%; height:65px; border-radius:32.5px; background:#FDF400; display:flex; align-items:center; text-align:justify; justify-content: center; }
.button_contact  { transition: background 0.4s ease, color 0.4s ease;}
.button_contact:hover { background:#fff; }

.button_contact em { font-size:20px; letter-spacing:0.05em; font-weight:bold; color:#137CD3; font-style:normal; margin-left:10px; }
.button_contact span { width:40px; height:40px; border-radius:50%; border:1px solid #137CD3; display:flex; align-items: center; text-align: justify; justify-content: center;}
.button_contact span img { width:20px; }
.contents_wrap.contact .contents .illust_contact { display:none; }
@media (min-width: 768px) {
  .contents_wrap.contact { height:185px; display:flex; align-items:center; padding-bottom:0; margin-top:120px; }
  .contents_wrap.contact .contents { width:90%; margin:0 auto; display:flex; justify-content: space-between; align-items: center; position:relative;  }
  .contact_wrap strong { font-size:24px; border-bottom:1px solid #fff; margin-bottom:16px; padding-bottom:10px; padding-top:0; }
  .contactinfo { width:80%; display:flex; justify-content: space-between;}
  .contactinfo li { width:50%; }
  .contactinfo li:nth-child(1) { margin-bottom:0; }
  .contact_wrap { width:100%; margin-left:0; }
  .contents_wrap.contact .contents .illust_contact { display:none;}
  .button_contact { width:360px; height:70px; border-radius:35px; }
}
@media (min-width:1200px) {
 .contents_wrap.contact .contents { width:1150px; }
   .contents_wrap.contact .contents .illust_contact { width:400px; position:absolute; bottom:-50px; display:block; left:-100px; display:block; }
  .contact_wrap { width:70%; margin-left:26%; }
}

/*買取事例・コラム*/
.ul_wrap { width:100%; display:flex; justify-content: space-between; flex-wrap:wrap; }
.ul_wrap li { width:100%; margin-bottom:40px; }
.ul_wrap li a { width:100%; display:block; }
.ul_wrap li a .photo { width:100%; height:205px; overflow:hidden; border-radius:10px; margin-bottom:10px; position: relative; z-index:0; }
.ul_wrap li a .photo .mark_new {  position:absolute; top:20px; left:20px; z-index:1; }
.swiper-slide div.photo .mark_new { position:absolute; top:20px; left:20px; z-index:1; }
.mark_new { width:40px; line-height:20px; font-size:13px; background:#137CD3; color:#fff; display:inline-block; font-family: 'Zen Kaku Gothic New', sans-serif; font-weight:normal; text-align:center; display:inline-block; letter-spacing:0.05em; padding-left:2px; padding-bottom:2px; }

.ul_wrap li a .photo img { width:100%; height:100%; object-fit:cover;transition: transform 0.4s ease; display:block; }
.ul_wrap li a:hover .photo img { width:100%; height:100%; object-fit:cover; }
.ul_wrap li a p { width:100%; font-size:18px; font-weight:bold; letter-spacing:0.1em; margin-bottom:10px; line-height:1.66em; display:inline-block; }
.date { width:130px; height:30px; font-size:16px; border-radius:12px; background:#F5F5F5; color:#137CD3; font-weight:bold; letter-spacing:0.1em; line-height:30px; text-align:center; }
.ul_wrap li a .arrow_wrap { position:relative; float:right; margin-right:10px; transition: transform 0.3s ease;}
.ul_wrap li a .arrow_wrap img { width:22px; height:22px; margin-top:4px; }
.ul_wrap li a .arrow_wrap:before {content: "";width: 32px;height: 1px;background-color:#000;position: absolute;left: -47px;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);-webkit-transition: width 0.3s ease;transition: width 0.3s ease;}
.ul_wrap li a:hover .arrow_wrap::before {width:40px; }
.ul_wrap li a:hover .arrow_wrap {transform: translateX(8px); /* 矢印が右へスライド */}
.ul_wrap li .caution { width:100%; text-align:center; display:inline-block; }

a .photo { width:100%; height:205px; overflow:hidden; border-radius:10px; margin-bottom:10px; position: relative; z-index:0; -webkit-mask-image: -webkit-radial-gradient(white, black);backface-visibility: hidden;}
a .photo img { width:100%; height:100%; object-fit:cover;transition: transform 0.4s ease; display:block;   will-change: transform;}
a:hover .photo img { width:100%; height:100%; object-fit:cover; transform: scale(1.2); display:block;}
@media screen and (min-width: 768px) {
  .ul_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: flex-start; /* デフォルトは左寄せ */
  }

  /* liが3個ちょうどのときだけ space-between にする */
  .ul_wrap:has(> li:nth-child(4)) {
    justify-content: flex-start; /* 4個以上なら左寄せに戻す */
    gap: 2rem;
  }

  .ul_wrap:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) {
    justify-content: space-between; /* 3個ちょうどのときだけ */
    gap: 0;
  }

  .ul_wrap li {
    width: 31%;
    margin-bottom: 40px;
    list-style: none;
  }

  .ul_wrap li a .photo_wrap {
    width: 100%;
    height: 200px;
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 10px;
  }

  .ul_wrap li a .photo_wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .ul_wrap li a strong {
    width: 100%;
    display: inline-block;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
  }
}


.contents_box { width:100%; height:auto; background:#F5F5F5; padding:30px 50px; display:block; margin:60px 0; }
.contents_box strong { width:100%; display:block; color:#137CD3; font-size:20px; font-weight:bold; letter-spacing:0.1em; margin-bottom:30px; }
.contents_box a { width:100%; display:block; font-size:16px; letter-spacing:0.1em; /*border-bottom:1px solid #ccc; */padding-bottom:10px; margin-bottom:10px;transition: color 0.3s ease; }
.contents_box a:link { text-decoration: underline;}
.contents_box a:hover { color:#137CD3; }
.column-item { width:100%; margin-bottom:80px; }
.column-item h2 { font-size:24px; letter-spacing:0.1em;  margin-bottom:30px;  color:#137CD3;}
.column-item p { margin-bottom:40px; letter-spacing:0.1em; line-height:36px;  }
.column-item .photo_wrap { width:100%; height:190px; border-radius:10px; overflow:hidden; }
.column-item .photo_wrap img { width:100%; height:100%; object-fit: cover;}
@media screen and (min-width: 768px) {
    .column-item .photo_wrap { width:600px; height:366px; margin:0 auto; display:block; }
    .contents_wrap.back_gray { margin-top:120px;}
}

.pagenation { width:auto; display:flex; justify-content: space-between; margin:0 auto 0 auto; }
.pagenation li { width:28%; padding:0 5%;  }
@media screen and (min-width: 768px) {
  .pagenation { width:50%; }
  .pagenation li { width:50px; padding:0; }
}
.pagenation li a { position:relative; text-align:center; }
.pagenation li a::after {content: "";position: absolute;bottom: -2px;right: 0; left: 0;height:1px;width: 100%;max-width: 100%; background-color:  #137CD3;transform: scaleX(0);transform-origin: left;opacity: 0;transition: transform 0.4s ease, opacity 0.4s ease;}
.pagenation li a:hover {color:  #137CD3; }
.pagenation li a:hover::after {transform: scaleX(1);opacity: 1;}
