@charset "utf-8";
/*
Theme Name:yonago-gas-2026
Description:yonago-gas-2026
Theme URI: 
Author: 2026-poool-k
Author URI: 
Version: 0.001
License: 
License URI: 
*/


/* 基本 */
body {margin: 0;padding: 0;background: #fff ;color: #1f2b33;letter-spacing:0.05em;}
* {box-sizing: border-box;}

body {
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

/* base*/

/* 全体枠 */
.all{min-width:1000px;}

/* 全体横幅1000px */
.all-width{
display: block !important;
margin: 0 auto !important;
width:1000px;min-width:1000px;
text-align:center;
}


/* Noto日本書体（Regular） */
@font-face {
font-family: 'Noto-Regular';
src: url('fonts/NotoSansCJKjp-Regular.ttf') format('truetype');
}
.Noto-Regular {font-family: 'Noto-Regular', sans-serif;}

/* Noto日本書体（Bold）*/
@font-face {
font-family: 'Noto-Bold';
src: url('fonts/NotoSansCJKjp-Bold.ttf') format('truetype');
}
.Noto-Bold {font-family: 'Noto-Bold', sans-serif;}

/* Noto明朝*/
.noto-mincho {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: ;
  font-style: normal;
}

.jost {
 font-family: "Jost", sans-serif;
 font-optical-sizing: auto;
 font-weight:600;
 font-style: normal;
}

.roboto {
 font-family: "Roboto", sans-serif;
 font-optical-sizing: auto;
 font-weight: ;
 font-style: normal;
 font-variation-settings:
 "wdth" 100;
}

/* Roboto（数字）*/
@font-face {
font-family: "Roboto";
src:url("fonts/Roboto-Bold.ttf") format("truetype");
}
.Roboto {font-family: "Roboto", sans-serif;letter-spacing: 0em;}

/* Jost-Medium（英字）*/
@font-face {
font-family: "Jost-M";
src:url("fonts/Jost-Medium.ttf") format("truetype");
}
.Jost-M {font-family: "Jost-M", sans-serif;letter-spacing: 0em;}

/* Jost-Bold（英字）*/
@font-face {
font-family: "Jost-B";
src:url("fonts/Jost-Bold.ttf") format("truetype");
}
.Jost-B {font-family: "Jost-B", sans-serif;letter-spacing: 0em;}

/* 明朝体フォント */
.font_mincho {
font-family:"游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
/* 太文字 */
.bold-font{font-weight: bold;}

/* 左寄せ */
.text-l{text-align: left;}
/* 中央寄せ */
.text-c{text-align: center !important;}
/* 右寄せ */
.text-r{text-align: right;}

/* テキスト色 */
.red{color: #C2143D !important;}
.green{color: #37B5B1 !important;}
.blown{color: #5B2400 !important;}

a{text-decoration:none;color:#80A1B6;}
a:hover{text-decoration:underline;}

/* 文字間つめ */
.letter-sp{ letter-spacing: -0.1em;}
/*取り消し線を引く*/
.deleted {text-decoration: line-through;}

/*文字にアンチエイリアスを効かせる*/
.font_smoothing {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

/*hr*/
hr{display:block;height:1px;border:0;border-top:1px solid #bdc9cf;margin:1.5em 0;padding:0;overflow: hidden;background: none;}
/*点線*/
.tenline{
border-top:1px dotted #bdc9cf;
height:1px;
margin: 30px 0;
}

/* image */
img {
vertical-align: bottom;
max-width: 100%;
height: auto;
}
/*リンク画像透明度*/
a img:hover {
filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;
}
a {transition : all 0.5s;}

/*iframe*/
iframe {max-width: 100%;}
/*非表示*/
.none {display: none !important;}

/*スマホ・PC振り分け*/
.sp {display: none !important;}
/* クリア */
.both{clear: both;}
/* マージン */
.sp-ss{margin-bottom:10px;}
.sp-s{padding-bottom:20px;}
.sp-m{margin-bottom:30px;}
.sp-l{margin-bottom:40px;}
.sp-ll{margin-bottom:50px;}

/*ページ上部へ*/
#page-top {
position: fixed !important;
bottom: 0;right:0;
width: ;height: ;
height: auto;z-index: 50;
text-align: center;
line-height: 0;
z-index: 200;
}
#page-top a {display: block;}


/*レスポンシブ対応------------------------------------------------------------------*/

@media screen and (max-width: 1000px){
/* 全体枠 */
.all{overflow: hidden;min-width:100%;}
.all-width{display: block;margin: 0 auto;width:92%;min-width:92%;}
/* 改行用 */
.newline{display:block;}
}

@media screen and (max-width:480px){
/*スマホ・PC振り分け*/
.pc{display: none !important;}
.sp {display: inline-block !important;}
}

@media screen and (max-width: 480px){
#page-top {width: 55px;height: auto;}
}

/*--------------------------------------------------------------------------------*/

/*▼▼▼トップの設定▼▼▼*/
/*全体*/
#container{}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
}
/*--------------------------------------------------------------------------------*/


/*ヘッダ メニュー */
.h-navi{width:100%;text-align: left;height: 100px;position: relative;font-family: 'Noto-Regular', sans-serif;}
.h-navi a{color:#1f2b33;}

.h-navi .h-logo{text-align: left;padding: 38px 0 0 38px;float: left;}
.h-navi .r-nav-box{float:right;}

.h-navi .h-menu{text-align: right;padding: 0 0 0 0;display: inline-block;vertical-align: middle;font-size: 16px;}
.h-navi .h-menu li{display: inline-block;vertical-align: middle;margin: 0 24px 0 0;position: relative;padding: 30px 0 0 0;}
.h-navi .h-menu a {display: block;/* ★項目内全域をリンク可能にする */}

.h-navi .h-menu .btn-link{font-size: 14px;font-weight: 700;}
.h-navi .h-menu .btn-link a{display: block;color:#fff;padding:14px 40px 14px 25px;border-radius: 24px;-webkit-border-radius: 24px;-moz-border-radius: 24px;
background:#1f2b33 url(images/arrow-mini-white01.png) no-repeat center right 14px;
}
.h-navi .h-menu .btn-link a:hover{
filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;
text-decoration:none;
}

.btn-link02{display:none;font-size: 14px;font-weight: 700;position: absolute;top: 30px;right: 95px;}
.btn-link02 a{display: block;color:#fff;padding:14px 40px 14px 25px;border-radius: 24px;-webkit-border-radius: 24px;-moz-border-radius: 24px;
background:#1f2b33 url(images/arrow-mini-white01.png) no-repeat center right 14px;
}
.btn-link02 a:hover{
filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;
text-decoration:none;
}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1100px){
.h-navi .r-nav-box{display:none;}
.btn-link02{display:inline-block;}
}

@media screen and (max-width:768px){
}

@media screen and (max-width:600px){
.btn-link02{display:none;}
.h-navi{height: 60px;}
.h-navi .h-logo{text-align: left;padding: 15px 0 0 15px;float: left;}
.h-navi .h-logo img{width: 180px;}
}

@media screen and (max-width:480px){
}
/*--------------------------------------------------------------------------------*/

/* メインムービー */
#main-movie{width: 100%;text-align: center;overflow: hidden;position: relative;height:697px;}
#main-movie .mySwiper02 .swiper-wrapper{position: relative;}
#main-movie .mySwiper02 .swiper-wrapper img{object-fit: cover;height:697px;}
#main-movie .mySwiper02{width:1200px;margin:0 auto;position: relative;}
#main-movie .tate-copy{position: absolute;top:108px;left:150px;z-index: 10;}
#main-movie .en-copy{position: absolute;bottom:120px;left:0;right:0;z-index: 10;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1200px){
#main-movie .mySwiper02{width:100.8%;overflow: hidden;}
#main-movie .tate-copy{top:108px;left:8%;width:150px;}
#main-movie .en-copy{left:-15px;right:0;}
}

@media screen and (max-width:768px){
#main-movie{height:550px;}
#main-movie .mySwiper02 .swiper-wrapper img{object-fit: cover;height:550px;}
#main-movie .tate-copy{top:80px;left:8%;width:110px;}
#main-movie .en-copy{bottom:130px;}
}

@media screen and (max-width:600px){
#main-movie{height:400px;}
#main-movie .mySwiper02 .swiper-wrapper img{object-fit: cover;height:400px;}
#main-movie .tate-copy{top:65px;left:8%;width:110px;}
#main-movie .en-copy{left:-8px;right:0;bottom:90px;}
}

@media screen and (max-width:480px){
#main-movie{height:272px;}
#main-movie .mySwiper02 .swiper-wrapper img{object-fit: cover;height:272px;}
#main-movie .tate-copy{top:40px;left:10%;width:68px;}
}

/*--------------------------------------------------------------------------------*/


/*お知らせ*/
#news{background-color:#008ED8;margin-top: -50px;position:relative;
min-height: 100px;
width:50%;text-align:right;color:#fff;z-index:2;
font-family: 'Noto-Regular', sans-serif;
}
#news a{color:#fff;text-decoration:underline}
#news .inner{padding:35px 0;font-size:12px;width:auto;display:table;margin-left: auto;min-width: 580px;}
#news h2{display:table-cell;text-align:left !important;vertical-align: middle;width: 122px;}
#news .r-box{display:table-cell;text-align:left !important;vertical-align: middle;padding:0 40px 0 20px;line-height:1.2;}
#news .inner .date{margin-right: 15px;display: inline-block;vertical-align: middle;}
#news .inner .title{display: inline-block;vertical-align: middle;margin: 8px 0;font-size: 120%;}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1200px){
#news{width:70%;}
}
@media screen and (max-width:768px){
#news{width:100%;text-align:left;}
#news .inner{display:block;margin-left:25px;min-width:auto;}
}
@media screen and (max-width:600px){
#news{min-height: auto;}
#news{margin-top: 0;}
#news .inner{padding:15px 0;}
}
@media screen and (max-width:540px){
#news h2{display:block;text-align:left !important;vertical-align: middle;width: 100px;}
#news .r-box{display:block;text-align:left !important;vertical-align: middle;padding:0;line-height:1.2;}
#news .inner .title{margin: 4px 0;}
}
@media screen and (max-width:480px){
#news .inner{padding:10px 0;}
#news h2{display:block;text-align:left !important;vertical-align: middle;width: 75px;}
#news .r-box{display:block;text-align:left !important;vertical-align: middle;padding:0;line-height:1.2;}
#news .inner .date{margin-right: 10px;font-size: 82%;}
#news .inner .title{margin: 4px 0;font-size: 82%;}
}

/*--------------------------------------------------------------------------------*/

/*はじめに*/
#Introduction{position:relative;padding:130px 0 110px 0;font-family: 'Noto-Regular', sans-serif;}
#Introduction .all-width{text-align:left;line-height:2.2;}
#Introduction .l-box{display: inline-block;vertical-align: top;width: 51%;}
#Introduction .l-box h2{font-weight: normal;font-size:230%;line-height:1.8;letter-spacing:0.05em;}
#Introduction .l-box .sub-title{color:#008ED8;font-size:125%;margin-top:20px;}
#Introduction .r-box{display: inline-block;vertical-align: top;width: 48%;font-size:105%;}

/*写真ならび*/
.Introduction-img{position:relative;width:100%;height:443px;z-index: 5;}
.Introduction-img img{width:100%;height:443px;object-fit: cover;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#Introduction .l-box{display: inline-block;vertical-align: top;width:48%;}
#Introduction .l-box h2{font-weight: normal;font-size:190%;line-height:1.6;}
#Introduction .l-box .sub-title{color:#008ED8;font-size:100%;margin:10px 0 25px 0;}
#Introduction .r-box{display: inline-block;vertical-align: top;width: 52%;font-size:90%;}
}
@media screen and (max-width:900px){
.Introduction-img{height:380px;}
.Introduction-img img{height:380px;}
}
@media screen and (max-width:768px){
#Introduction{position:relative;padding:70px 0 70px 0;}
#Introduction .l-box{display:block;width:100%;text-align: center;}
#Introduction .r-box{display:block;width: 100%;text-align: center;}
.Introduction-img{height:280px;}
.Introduction-img img{height:280px;}
}
@media screen and (max-width:600px){
#Introduction .l-box{display:block;width:100%;margin:0 auto;}
#Introduction .r-box{display:block;width: 100%;margin:0 auto;}
}
@media screen and (max-width:480px){
#Introduction{position:relative;padding:50px 0 50px 0;}
#Introduction .l-box h2{font-size:150%;}
#Introduction .l-box .sub-title{font-size:90%;margin:5px 0 15px 0;}
#Introduction .r-box{font-size:85%;}
.Introduction-img{height:174px;}
.Introduction-img img{height:174px;}
}
/*--------------------------------------------------------------------------------*/


/*会社を知る*/
#company{position:relative;margin-top:-180px;margin-bottom:200px;background:transparent url(images/map.png) no-repeat right 30% top;padding-top:180px;font-family: 'Noto-Regular', sans-serif;}

#company .all-width{text-align:left;}
#company .ue-box{margin-top:120px;}
#company .read{margin:30px 0 60px 0;font-size:26px;line-height:2.2;}

#company .st-box{}
#company .st-box .box-b{width:48%;background:;display: inline-block;vertical-align: top;margin-right:2%;margin-bottom:2%;height:210px;color:#fff;position:relative;border:1px solid #1B9ADC;}
#company .st-box .bg-a{background:#1B9ADC url(images/campany-a.png) no-repeat right 50%;background-size:auto;}
#company .st-box .bg-b{background:#1B9ADC url(images/campany-b.png) no-repeat right 50%;background-size: auto;}
#company .st-box .box-b a{color:#fff;text-decoration:none;height:210px;display:block;}
#company .st-box .box-b:hover{background:#fff;border:1px solid #1F2B33;}
#company .st-box .bg-a:hover{background:rgba(255,255,255,0.6) url(images/campany-a.png) no-repeat right 50%;background-size:auto;background-blend-mode: lighten;}
#company .st-box .bg-b:hover{background:rgba(255,255,255,0.6) url(images/campany-b.png) no-repeat right 50%;background-size: auto;background-blend-mode: lighten;}

#company .st-box .box-b a:hover{color:#1F2B33;}
#company .st-box .box-b h3{padding:60px 15px 15px 40px;font-size:150%;}
#company .st-box .box-b .txt{padding:0 15px 15px 40px;font-size:95%;line-height:1.6;}
#company .st-box .box-b .arrow{width:46px;height:46px;position:absolute;bottom:15px;right:15px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;background:;}
#company .st-box .box-b .arrow:hover{background-color:#1F2B33;border:1px solid #1F2B33;display:block;}
#company .st-box .box-w{width:48%;background:#fff;border:1px solid #1F2B33;display: inline-block;vertical-align: top;margin-right:2%;height:110px;position:relative;}
#company .st-box .box-w a{color:#1F2B33;text-decoration:none;height:110px;display:block;}

#company .st-box .box-w:hover{background:#EDF3F7;transition : all 0.3s;border:1px solid #EDF3F7;}
#company .st-box .box-w a:hover{color:#1F2B33;}
#company .st-box .box-w h4{padding:45px 15px 15px 40px;font-size:120%;}
#company .st-box .box-w .sns{height:auto;display:inline-block;position:absolute;top:35px;right:35px;}
#company .st-box .box-w .sns a{height:auto;display:inline-block;margin-left:30px;}
#company .st-box .box-w .arrow{width:46px;height:46px;position:absolute;top:30px;right:15px;border:1px solid #1F2B33;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;background-color:#fff;}
#company .st-box .box-w .arrow:hover{background-color:#fff;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1200px){
#company{position:relative;margin-top:-180px;margin-bottom:200px;background:transparent url(images/map.png) no-repeat right -100px top;padding-top:180px;}
}
@media screen and (max-width:1000px){
#company{position:relative;margin-top:-58px;margin-bottom:200px;background:transparent url(images/map.png) no-repeat right 0 top;padding-top:180px;background-size:600px auto;}
#company .ue-box{margin-top:-20px;}
#company .read{margin:30px 0 60px 0;font-size:22px;line-height:1.6;}
}
@media screen and (max-width:768px){
#company{position:relative;margin-top:-58px;margin-bottom:170px;background:transparent url(images/map.png) no-repeat right -50px top;padding-top:140px;background-size:480px auto;}
#company h2{width:310px;}
}

@media screen and (max-width:678px){
#company .st-box .box-b h3{padding:40px 15px 15px 25px;font-size:130%;}
#company .st-box .box-b .txt{padding:0 15px 15px 25px;font-size:85%;}
#company .st-box .box-w h4{padding:45px 15px 15px 25px;font-size:110%;}
}

@media screen and (max-width:600px){
#company{margin-bottom:70px;}
#company .st-box .box-b{width:100%;margin-right:0;margin-bottom:2%;height:140px;}
#company .st-box .box-b a{color:#fff;text-decoration:none;height:140px;display:block;}
#company .st-box .box-b h3{padding:30px 15px 15px 25px;}
#company .st-box .box-w{width:100%;margin-right:0;height:110px;margin-bottom:2%;}
}

@media screen and (max-width:480px){
#company{margin-bottom:50px;
background:transparent url(images/map.png) no-repeat center top 230px;padding-top:140px;background-size:440px auto;}
#company .ue-box{margin:-20px 0 250px 0;}
#company .read{margin:20px 0 0 0;}
#company .st-box .box-b{width:100%;margin-right:0;margin-bottom:2%;height:auto;}
#company .st-box .box-b a{color:#fff;text-decoration:none;height:auto;display:block;}
#company .st-box .box-b h3{padding:15px 15px 10px 25px;font-size:115%;}
#company .st-box .box-b .txt{font-size:75%;}
#company .st-box .box-b .arrow{bottom:24px;right:20px;}
#company .st-box .box-w{height:70px;}
#company .st-box .box-w h4{padding:26px 15px 15px 25px;}
#company .st-box .box-w .sns{top:15px;right:20px;}
#company .st-box .box-w .arrow{top:11px;right:20px;}
}

/*--------------------------------------------------------------------------------*/

/*仕事を知る*/
#our-job{position:relative;margin-top: 80px;font-family: 'Noto-Regular', sans-serif;}
.g-bg{
width: 100%;
background: linear-gradient(90deg, #EDF3F7 0%, #EDF3F7 50%, #fff 50%, #fff 100%);
display:inline-block;
height: auto;
}
#our-job .all-width{text-align:left;}
#our-job h2{margin:60px 0 60px 0;}
#our-job .ue-box{text-align:left;position:relative;}
.our-job-img{position:absolute;top:-80px;right:0;width:52%;height:450px;}
.our-job-img img{width:100%;height:450px;object-fit: cover;}
#our-job .st-box{text-align:left;}

#our-job h3{margin:60px 0 30px 0;font-weight:normal;font-size:170%;line-height:1.3;}
#our-job .read{line-height: 2.0;margin-bottom: 80px;}
#our-job .st-box .box{position:relative;vertical-align: top;
display:inline-block;width:31.2%;margin-right: 3%;
font-size:90%;line-height:1.8;
}
#our-job .st-box .box:nth-of-type(3n){margin-right: 0;}
#our-job .st-box .box .job01-img{
position:relative;background:transparent url(images/job01.png) no-repeat left top; background-size:cover;height:318px;
}
#our-job .st-box .box .job02-img{
position:relative;background:transparent url(images/job02.png) no-repeat left top; background-size:cover;height:318px;
}
#our-job .st-box .box .job03-img{
position:relative;background:transparent url(images/job03.png) no-repeat left top; background-size:cover;height:318px;
}
#our-job .st-box .box .grd{position:absolute;bottom:0;left:0;width:100%;height:auto;}
#our-job .st-box .box .number{position:absolute;top:-20px;right:0;}
#our-job .st-box .box h4{font-size:23px;color:#fff;position:absolute;bottom:18px;left:18px;}
#our-job .st-box .box .txt{padding:22px 0 0 0;}
#our-job .st-box .box .arrow{position:absolute;right:18px;bottom:18px;
width:46px;height:46px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}

#our-job .st-box .box .arrow:hover{background-color:rgba(255,255,255,0.3);}

#our-job .group{color:#80A1B6;font-size:95%;margin-top:12px;}

#our-job .more{padding-bottom:120px !important;text-align:center;margin-top:30px;}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#our-job h3{width:45%;font-size:140%;}
#our-job .read{width:45%;line-height: 1.8;margin-bottom: 80px;}
#our-job .st-box .box h4{font-size:2.2vw;}
#our-job .st-box .box{position:relative;vertical-align: top;
display:inline-block;width:32%;margin-right: 2%;
font-size:90%;line-height:1.8;
}
}

@media screen and (max-width:768px){
#our-job{position:relative;margin-top: 0;}
.our-job-img{top:-60px;height:400px;}
.our-job-img img{height:400px;}
#our-job h2{width:310px;}
#our-job h3{font-size:130%;}
#our-job .read{font-size:90%;}
#our-job .st-box .box .arrow{position:absolute;right:10px;bottom:10px;
width:40px;height:40px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}
#our-job .st-box .box h4{font-size:2.2vw;bottom:13px;left:13px;}
#our-job .st-box .box .txt{font-size:85%;}
#our-job .group{color:#80A1B6;font-size:80%;margin-top:12px;}
#our-job .more{padding-bottom:90px !important;margin-top:20px;}
}

@media screen and (max-width:600px){
#our-job h2{margin:0 0 20px 0;}
#our-job h3{width:100%;margin:30px 0 20px 0;font-size:130%;}
#our-job .read{width:100%;line-height: 1.8;margin-bottom: 340px;}
.our-job-img{position:absolute;top:260px;right:0;width:100%;height:266px;}
.our-job-img img{width:100%;height:266px;object-fit: cover;}
#our-job .st-box .box,#our-job .st-box .box:nth-of-type(3n){display:block;width:320px;margin-right: 0;
margin:0 auto 30px auto
}
#our-job .st-box .box .number{width:55px;top:-15px;}
#our-job .st-box .box h4{font-size:21px;}
}

@media screen and (max-width:480px){
#our-job .st-box .box,#our-job .st-box .box:nth-of-type(3n){display:block;width:86%;}
#our-job .more{padding-bottom:60px !important;margin-top:20px;}
}

/*--------------------------------------------------------------------------------*/


/*人を知る*/
#interview{padding:120px 0;min-height:1000px;font-family: 'Noto-Regular', sans-serif;}
#interview .all-width{text-align:left;}
#interview .l-box{display: inline-block;vertical-align: top;width:47%;}
#interview .r-box{display: inline-block;vertical-align: top;width:52%;}
#interview h3{margin:20px 0 30px 0;font-weight:normal;font-size:170%;line-height:1.3;}
#interview .read{line-height: 2.0;margin-bottom: 80px;}
#interview .more{text-align:right !important;width: 100%;padding-right: 100px;margin-top: 10px;position:relative;z-index: 2;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#interview h3{font-size:140%;line-height:1.3;}
#interview .more{padding-right: 40px;}
#interview .read{line-height: 1.8;margin-bottom: 80px;}
}
@media screen and (max-width:768px){
#interview{padding:80px 0;}
#interview h2{width:310px;}
#interview h3{font-size:130%;}
#interview .read{font-size:90%;}
#interview .more{text-align:center !important;width: 100%;padding-right: 0;margin-top: -60px;}
}
@media screen and (max-width:600px){
#interview .l-box{display: inline-block;vertical-align: top;width:100%;}
#interview .r-box{display: inline-block;vertical-align: top;width:100%;}
#interview .read{margin-bottom: 50px !important;}
}
@media screen and (max-width:480px){
#interview{padding:50px 0 0 0;}
#interview h3{margin:28px 0 12px 0;}
#interview .read{line-height: 2.0;margin-bottom: 80px;}
#interview .read{margin-bottom: 30px !important;}
}
/*--------------------------------------------------------------------------------*/

/*クロストーク*/
#crosstalk{position:relative;background:transparent url(images/closstalk-pc.jpg) no-repeat center top; background-size:cover;margin-bottom: 200px;height: 630px;text-align:left !important;}
#crosstalk .cross-copy{position:absolute;top:230px;right:45px;writing-mode: vertical-rl;text-orientation:upright !important;color:#fff;line-height:2.5 !important;text-align:left !important;}
#crosstalk .cross-copy span {text-combine-upright: all;}
#crosstalk .cross-title{position:absolute;bottom:25px;left:40px;}
#crosstalk .arrow-link{position:absolute;bottom:30px;right:40px;border:2px solid #fff;width:100px;height:100px;padding-top: 0;
border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;display:block;
}
#crosstalk .arrow-link a{display:block;}
#crosstalk .arrow-link:hover{background-color:rgba(255,255,255,0.3)}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#crosstalk{height:500px;}
#crosstalk .cross-copy{position:absolute;top:100px;right:45px;}
#crosstalk .cross-title{width:75%;}
}
@media screen and (max-width:768px){
#crosstalk{margin-bottom: 160px;}
}
@media screen and (max-width:600px){
#crosstalk{margin-bottom: 80px;}
#crosstalk .cross-title{left:20px;width:70%;}
#crosstalk .arrow-link{bottom:30px;right:20px;width:65px;height:65px;}
}
@media screen and (max-width:480px){
#crosstalk{margin-top: -160px;}
#crosstalk{margin-bottom: 60px;}
#crosstalk{position:relative;background:transparent url(images/crosstalk-sp.jpg) no-repeat center top; background-size:cover;height: 470px;}
#crosstalk .cross-copy{display:none;}
#crosstalk .cross-title{left:0;width:100%;bottom:90px;padding:0 15px}
#crosstalk .arrow-link{bottom:20px;right:15px;width:40px;height:40px;}
.sp-cross-copy{position:absolute;bottom:20px;left:15px;color:#fff;font-size:10.5px;line-height:1.8;width:78%;}
}

/*--------------------------------------------------------------------------------*/

/*環境・福利厚生*/
#workstyle{position:relative;font-family: 'Noto-Regular', sans-serif;}
.g-bg{
width: 100%;
background: linear-gradient(90deg, #EDF3F7 0%, #EDF3F7 50%, #fff 50%, #fff 100%);
display:inline-block;
height: auto;
}
#workstyle .all-width{text-align:left;}
#workstyle h2{margin:60 0 60px 0;}
#workstyle .ue-box{text-align:left;position:relative;}
.workstyle-img{position:absolute;top:-80px;right:0;width:52%;height:450px;}
.workstyle-img img{width:100%;height:450px;object-fit: cover;}
#workstyle .st-box{text-align:left;}

#workstyle h3{margin:60px 0 30px 0;font-weight:normal;font-size:170%;line-height:1.3;}
#workstyle .read{line-height: 2.0;margin-bottom: 80px;}
#workstyle .st-box .box{position:relative;vertical-align: top;
display:inline-block;width:31.2%;margin-right: 3%;border:1px solid #1F2B33;background-color:#fff;height: 300px;
padding:;
font-size:90%;line-height:1.6;
}
#workstyle .st-box .box:hover{background-color:#008ED8;color#fff;;border:1px solid #008ED8;transition : all 0.3s;}
#workstyle .st-box .box a:hover{color:#fff;}
#workstyle .st-box .box:nth-of-type(3n){margin-right: 0;}
#workstyle .st-box .box a{text-decoration:none;color:#1F2B33;display:block;height: 100%;}
#workstyle .st-box .box h4{font-size:23px;padding:30px 30px 10px 30px;}
#workstyle .st-box .box .txt{padding:0 0 0 30px;}
#workstyle .st-box .box .arrow{position:absolute;right:18px;bottom:18px;
width:46px;height:46px;border:1px solid #1F2B33;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;
background-color:rgba(255,255,255,1);padding-top: ;}
#workstyle .more{padding-bottom:120px !important;text-align:center;margin-top:30px;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
#workstyle h3{width:45%;font-size:140%;}
#workstyle .read{width:45%;line-height: 1.8;margin-bottom: 80px;}
}

@media screen and (max-width:768px){
.workstyle-img{top:-80px;right:0;width:52%;height:380px;}
.workstyle-img img{height:380px;}
#workstyle h2{width:310px;}
#workstyle h3{font-size:130%;}
#workstyle .read{font-size:90%;margin-bottom: 50px;}
#workstyle .more{padding-bottom:80px !important;}
}

@media screen and (max-width:600px){
#workstyle h2{margin:0 0 20px 0;}
#workstyle h3{width:100%;margin:30px 0 20px 0;font-size:130%;}
#workstyle .read{width:100%;line-height: 1.8;margin-bottom: 335px;}
.workstyle-img{position:absolute;top:260px;right:0;width:100%;height:266px;}
.workstyle-img img{width:100%;height:266px;object-fit: cover;}
#workstyle .st-box .box{width:100%;margin-right: 0;margin-bottom: 10px;height: auto;
font-size:80%;line-height:1.6;}
#workstyle .st-box .box h4{font-size:23px;padding:15px 30px 3px 30px;}
#workstyle .st-box .box .txt{padding:0 0 15px 30px;}
#workstyle .st-box .box .arrow{position:absolute;right:18px;bottom:32px;}
}

@media screen and (max-width:480px){
#workstyle .st-box .box{width:100%;margin-right: 0;margin-bottom: 10px;height: auto;
font-size:80%;line-height:1.6;}
#workstyle .st-box .box h4{font-size:17px;padding:10px 20px 3px 20px;}
#workstyle .st-box .box .txt{padding:0 0 10px 20px;font-size:11px;}
#workstyle .st-box .box .arrow{position:absolute;right:18px;bottom:20px;}
#workstyle .more{margin-top:20px;}
}

/*--------------------------------------------------------------------------------*/

/*数字で知る米子ガス*/
#data{background:transparent url(images/blue-bg.png) repeat left top 50px;padding-bottom:50px !important;margin-top:150px !important;}

#data .all-width{margin-top:-200px !important;z-index:2;position:relative;}
#data .mushimegane{text-align:left;margin-left:-100px !important;}
#data h2{margin-top:-170px !important;margin-bottom:70px !important;}
#data .box{background-color:#fff;padding:25px 25px;margin-bottom:20px;position:relative;}
#data .st-box .l-box .box{padding:25px 10px;}
#data .box h3{font-size:20px;border-bottom:2px solid #8F9599;padding-bottom:22px;
margin: 0 0 25px 0;}
#data .box h4{font-size:16px;margin:25px 0 10px 0;}
#data .ue-box{}
#data .ue-box .l-box{width:49%;float:left;}
#data .ue-box .l-box .box{height:480px;}
#data .ue-box .r-box{width:49%;float:right;}

#data .ue-box .r-box .box{height:230px;}
#data .ue-box .r-box .kokyaku .inn{display: inline-block;vertical-align: top;line-height:1;font-size:85%;}
.toshi{width:35%;}
.lp{width:33%;}
.denki{width:30%;}
#data .ue-box .r-box .kokyaku .inn .ill{display:block;}
#data .ue-box .r-box .kokyaku .inn .txt{margin:5px 0;background:#E5E9EC;padding:4px 12px;display:inline-block;border-radius: 12px;-webkit-border-radius: 12px;-moz-border-radius: 12px;
}
#data .st-box{clear:both;}
#data .st-box .l-box{width:49%;float:left;}

#data .st-box .r-box{width:49%;float:right;}
#data .st-box .l-box .sl-box{width:48%;float:left;height:230px;}
#data .st-box .l-box .sr-box{width:48%;float:right;height:230px;}
#data .st-box .r-box .box{height:480px;}
#data .st-box .r-box .box .chuu{font-size:14px;text-align:left;margin-top:40px;}
#data .more{clear:both;padding-top:10px !important;}
#data .kome{color:#fff;font-size:80%;margin:60px 0;}
.oyako{position:absolute;bottom:-25px;right:0;}
.suuchi{font-weight:700;}
.souritsu .inner{background:transparent url(images/il01.png) no-repeat top center;
background-size: auto 80%;
line-height:1.1;padding:5px 0 20px 0 ;letter-spacing:0.1em;}
.souritsu .suuchi{font-size:450%;}
.kokyaku h3{margin-bottom:10px !important;}
.kokyaku .suuchi{font-size:190%;}
#data .st-box .l-box .suuchi{font-size:280%;}
.tani{font-size:65% !important;}
.tani-s{font-size:65% !important;}
.heikin .inner-l{width:40%;display: inline-block;vertical-align: bottom;}
.heikin .inner-r{width:40%;display: inline-block;vertical-align: bottom;}
.heikin .inner-r .suuchi{font-size:450%;}
.heikin .inner-r .tani{font-size:45% !important;}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:900px){
#data .mushimegane{text-align:left;margin-left:-50px !important;
width:200px !important;
}
#data h2{margin-top:-40px !important;margin-bottom:50px !important;}
 .tani,.tani-s{font-size:35% !important;}
#data .st-box .l-box .suuchi{font-size:260%;}
}
@media screen and (max-width:768px){
#data{margin-top:120px !important;}
#data .all-width{margin-top:-150px !important;z-index:2;position:relative;}
#data h2{margin-top:-100px !important;margin-bottom:50px !important;}
#data .kome{color:#fff;font-size:80%;margin:30px 0 20px 0;}
}

@media screen and (max-width:700px){
#data .box h3{margin: 0 0 25px 0;}
#data .ue-box .l-box{width:100%;}
#data .ue-box .r-box{width:100%;}
#data .st-box .l-box{width:100%;}
#data .st-box .r-box{width:100%;}
#data .ue-box .l-box .box{height:auto;}
#data .ue-box .r-box .box{height:auto;}
.souritsu .inner{background:transparent url(images/il01.png) no-repeat top center;
background-size: auto 80% ;
line-height:1.1;padding:5px 0 20px 0 ;letter-spacing:0.1em;}
}
@media screen and (max-width:480px){
#data{padding-bottom:40px !important;}
#data .mushimegane{text-align:left;margin-left:-20px !important;
width:120px !important;
}
#data h2{margin-top:-30px !important;margin-bottom:20px !important;}
#data .kome{color:#fff;font-size:70%;margin:20px 0 20px 0;}
}
/*--------------------------------------------------------------------------------*/

/*エントリー*/
#entry{position:relative;overflow: hidden;
height:710px;
background:transparent url(images/entry.jpg) no-repeat right center;
background-size:cover;
font-family: 'Noto-Regular', sans-serif;
}
#entry a{text-decoration:none;}
#entry a:hover{filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;}
#entry .all-width{text-align:left;padding:120px 0;width:90%;}
#entry .joinus{position:absolute;bottom:-15px;right:-15px;z-index:0;}
#entry h2{color:#fff;font-weight:normal;font-size:2.1em;line-height:1.8em;margin-bottom:1.3em;letter-spacing:0.05em;}
#entry .entry-btn{text-align:center;width:330px;font-size:0.9em;}
#entry .entry-btn span{vertical-align: middle;}
#entry .entry-btn .large{font-size:200%;font-family: 'Noto-Bold', sans-serif;margin-right:0.4em}
#entry .entry-btn a{
display: block;color:#fff;padding:20px 25px 20px 25px;border-radius: 32px;-webkit-border-radius:32px;-moz-border-radius: 32px;
background:#008ED8 url(images/arrow-mini-white01.png) no-repeat center right 20px;
}

#entry .mynabi-btn{text-align:center;width:330px;margin:20px 0;}
#entry .mynabi-btn a{
display: block;color:#fff;padding:20px 25px 20px 25px;border-radius: 32px;-webkit-border-radius:32px;-moz-border-radius: 32px;
background:#0468CA url(images/arrow-mini-white02.png) no-repeat center right 20px;
}

#entry .youkou-btn{text-align:center;width:330px;position:relative;z-index:1;}
#entry .youkou-btn a{
display: block;color:#1f2b33;padding:20px 25px 20px 25px;border-radius: 32px;-webkit-border-radius:32px;-moz-border-radius: 32px;
background:#fff url(images/arrow-mini-black.png) no-repeat center right 20px;
}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 900px){
#entry{height:600px;}
#entry .all-width{text-align:left;padding:80px 0;width:90%;}
#entry h2{;font-size:1.8em;line-height:1.8em;}
#entry .joinus{width:60%;bottom:-6px;right:-6px;}
}
@media screen and (max-width: 480px){
#entry{height:470px;}
#entry .all-width{text-align:left;padding:40px 0;}
#entry h2{font-size:1.4em;line-height:1.6em;}
#entry h2{margin-bottom:6.5em;}
#entry .entry-btn{text-align:center;width:100%;font-size:0.9em;}
#entry .entry-btn a,#entry .mynabi-btn a,#entry .youkou-btn a{padding:12px 25px 12px 25px;}
#entry .mynabi-btn{text-align:center;width:100%;margin:10px 0;}
#entry .youkou-btn{text-align:center;width:100%;}
}

/*--------------------------------------------------------------------------------*/

/*フッタ*/
footer{background:#fff;padding: 110px 0 120px 0;width: 100%;text-align: center;overflow: hidden;position: relative;min-width:1000px;z-index:0;}
footer a{color:#1f2b33;font-family: 'Noto-Regular', sans-serif;}
.f-logo{width:;float:left;text-align:left;}
footer .f-menu{width:;float:right;text-align:right;font-size: 0.9em;font-weight: 700;margin-bottom: 4em;}
footer .f-menu ul{text-align:left;display:inline-block;vertical-align: top;margin-left: 3em;}
footer .f-menu ul li {
position: relative;line-height: 2.2;
padding-left: 1em;
}
footer .f-menu ul li:before {
content: "●";
color:#BDC9CF;
position: absolute;
left: 0;
top: 25%;
font-size: 0.5em;
}

footer .add-tel{clear:both;font-size: 0.9em;line-height: 1.3;
border-top: 1px solid #bdc9cf;border-bottom: 1px solid #bdc9cf;
  padding: 1.8em 0;
}
footer .sns{margin:1.5em 0 4em 0;}
footer .sns a{display:inline-block;margin: 0 0.8em ;}

footer .f-menu-st{display:inline-block;font-size: 0.85em;vertical-align: middle;line-height: 1.3;}
footer .f-menu-st{vertical-align: top;margin-left: 3em;}
footer .f-menu-st li {display:inline-block;border-right:1px solid #BDC9CF;padding: 0 0.8em;}
footer copyright{display:inline-block;font-size: 0.85em;vertical-align: middle;line-height: 1.3;color: #808080;margin-left: 2em;}
/*レスポンシブ対応------------------------------------------------------------------*/

@media screen and (max-width: 1000px){
footer{min-width:100%;}
.f-logo img{width:300px;}
}

@media screen and (max-width: 900px){
.f-logo img{width:260px;}
footer{background:#fff;padding: 70px 0 70px 0;}
.f-logo{width:100%;float:none;text-align:center;}
footer .f-menu{width:100%;float:none;text-align:center;font-size: 0.9em;margin:2em 0;}
footer .f-menu ul{margin: 0 3em;}
}

@media screen and (max-width: 768px){
footer .f-menu ul{margin: 0 1.5em;}
}
@media screen and (max-width: 600px){
footer .f-menu{font-size: 0.8em;}
footer .f-menu ul{margin: 10px 1.5em;}
footer .add-tel span{display:block;line-height: 1.8;}
footer copyright{display:block;font-size: 0.7em;margin-left: 0;margin-top: 10px;}
}
@media screen and (max-width: 500px){
footer{background:#fff;padding: 60px 0 60px 0;}
footer .f-menu ul{margin: 10px 1em;}
footer .add-tel{padding: 1em 0;font-size: 0.85em;}
footer .sns{margin:1em 0 2em 0;}
footer .f-menu-st{font-size: 0.7em;margin-left: 0;}
}
@media screen and (max-width: 440px){
footer .f-menu{text-align: left;}
footer .f-menu ul{margin: 4px 0;text-align: left;}
footer .f-menu ul li{display:inline-block;margin:0 3px;line-height: 1.6;}
}
/*--------------------------------------------------------------------------------*/


/* スクロールアクション用 */
.invisible {
transition: opacity 0.5s ease;
opacity: 0.0;
}

.visible {
transition: opacity 0.5s ease;
opacity: 1.0;
}

.block {
/* 1秒遅れてアニメする */
animation-delay: 1s;
}
.fade {
-webkit-animation-duration: 5s;
animation-duration: 5s !important;
}


/*人を知るswiperスライダー*/


.swiper-wrapper {
  margin-left: 14%;
}

.swiper-slide {
  width: 25% !important;
  padding-right: 1%;
  margin-left: .0%;
  padding-top: 0%;
  opacity: .8;
}

.swiper-slide.swiper-slide-active {
  width: 28% !important;
  padding-top: 0;
  opacity: 1;
  font-size: 110%;
}


.mySwiper02 .swiper-wrapper {
margin-left: 0;
}

.mySwiper02 .swiper-slide {
  width: 100% !important;
  padding-right: 1%;
  margin-left: 0;
  padding-top: 0;
  opacity: .8;
}

.mySwiper02 .swiper-slide.swiper-slide-active {
  width: 100% !important;
  padding-top: 0;
  opacity: 1;
  font-size: 100%;
}

.swiper-slide img {
  width: 100%;
}
@media only screen and (max-width: 1200px) {
.swiper-wrapper {
  margin-left: 14%;
}

.swiper-slide {
  width: 33.3% !important;
  padding-right: 1.5%;
  margin-left:0;
  padding-top: 0%;
  opacity: 1;
}

.swiper-slide.swiper-slide-active {
  width: 40% !important;
  padding-top: 0;
  opacity: 1;
  font-size: 110%;
}

.swiper-slide img {
  width: 100%;
}
}
@media only screen and (max-width: 768px) {
  .swiper-wrapper {
    margin-left:0;
  }
  .swiper-slide {
    width: 50% !important;
  padding-right:5%;
  }
  .swiper-slide.swiper-slide-active {
    width: 55% !important;
  }

.swiper-pagination,
.swiper-button-prev,
.swiper-button-next{
  display:none;
}
}

/*人を知るスライダー*/
.swiper-slide{}
.swiper-slide a{color:#fff;}
.swiper-slide .photobox{position:relative;width: 100%;color:#fff;}
.swiper-slide .slide-grd{position:absolute;bottom:0;left:0;}
.swiper-slide .slide-btm{position:absolute;bottom:12px;left:18px;color:#fff;}
.slide-name{display:inline-block;vertical-align: top;line-height:1;font-size:35px;padding-right:5px;}
.slide-spec{display:inline-block;vertical-align: top;line-height:1.3;font-size:80%;}
.swiper-slide .slide-arrow{position:absolute;bottom:12px;right:12px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}
.swiper-slide .slide-arrow img{width: 50px !important;height: 50px !important;}


.swiper-slide.swiper-slide-active .slide-arrow{position:absolute;bottom:14px;right:14px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}
.swiper-slide.swiper-slide-active .slide-arrow img{width: 60px !important;height: 60px !important;}

.slide-arrow:hover{background-color:rgba(255,255,255,0.3)}

.swiper-slide img{vertical-align: bottom;}
.swiper-slide .photobox img{width: 100%;}
.swiper-slide .slide-comment{line-height:1.8;margin-top:12px;;font-size:90%;}
.sp-no-br{display:inline-block;}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:1000px){
.slide-name{display:inline-block;vertical-align: top;line-height:1;font-size:28px;padding-top:2px;padding-right:5px;}
.slide-spec{display:inline-block;vertical-align: top;line-height:1.3;font-size:70%;}
}

@media screen and (max-width:768px){
.swiper-slide .slide-comment{line-height:1.5;margin:10px 10px 0 10px;font-size:80%;}
.sp-no-br{display: none ;}
.swiper-slide .slide-btm{;bottom:10px;left:10px;}
.slide-name{display:inline-block;vertical-align: top;line-height:1;font-size:30px;padding-right:5px;}
.slide-spec{display:inline-block;vertical-align: top;line-height:1.3;font-size:70%;}
}
@media screen and (max-width:600px){
.slide-name{display:block;}

}
@media screen and (max-width:480px){
.swiper-slide .slide-arrow{position:absolute;bottom:12px;right:12px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}
.swiper-slide .slide-arrow img{width: 30px !important;height: 30px !important;}


.swiper-slide.swiper-slide-active .slide-arrow{position:absolute;bottom:14px;right:14px;border:1px solid #fff;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;text-align: center;}
.swiper-slide.swiper-slide-active .slide-arrow img{width: 40px !important;height: 40px !important;}

.swiper-slide .slide-comment{font-size:70%;}
}
/*--------------------------------------------------------------------------------*/

/* スライダー全体 */
.Introduction-img .slider-wrapper {
  display: flex; /* スライドのグループを横並び */
  overflow: hidden; /* はみ出たスライドを隠す */
}
/* スライドグループ */
.Introduction-img .slider {
  animation: scroll-left 50s infinite linear .5s both;
  display: flex; /* スライドを横並び */
}
/* スライド */
.Introduction-img .slide {
width:2400px;
}
/* スライドの画像 */
.Introduction-img .slide img {
display: block;
width:2400px;
}
/* CSSアニメーション */
@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}


@media screen and (max-width:900px){
/* スライドの画像 */
.Introduction-img .slide {width:2100px;}
.Introduction-img .slide img {width:2100px;}
}
@media screen and (max-width:768px){
.Introduction-img .slide {width:1800px;}
.Introduction-img .slide img {width:1800px;}
}

@media screen and (max-width:480px){
.Introduction-img .slide {width:1200px;}
.Introduction-img .slide img {width:1200px;}
}
