/* Move down content because we have a fixed navbar that is 3.5rem tall */
body {
  padding-top: 3.5rem;
  padding-bottom: 0;
}

/*fontアンチエイリアス*/
body {
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
}
@media only screen and 
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 2dppx) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}
/* ssssssssssssssssss 
J.create
bootstrap4 カスタム
ssssssssssssssssss*/

/* header関連
---------------------------------------------------------------------*/
header .navbar{
	padding: 0 !important;
}
.logo {
  background-image: url(../img/logo_color.png);
  height: 80px;
  width: 400px;
  float: left;
  background-repeat: no-repeat;
  background-size: contain;
}
.mainMENU{
	/* padding-left: 29%; */
	text-align: right !important;
	font-size: .95em;
	margin: 10px 0 ;
padding-right:0;
}

.mainMENU .navbar-collapse{
justify-content: flex-end;}
.mainMENU .navbar-nav{
	display: -webkit-flex !important;
    display: flex !important;
    -webkit-justify-content: flex-end !important;
    justify-content: flex-end !important;
    -webkit-align-items: flex-end !important;
    align-items: flex-end !important;
}
.MENUbgTEL{
	background-color: #666;
	border-radius: 0 0 5px 5px;
	color: #fff;
	padding: .5em 1em;
	margin: -10px 0px 0 15.5em;
    text-align: center;
}
/* カタログPDF 関連
---------------------------------------------------------------------*/
.pdf_menu .card{
	border: none !important;
}
.pdf_menu .col-3{
padding-right: 1px !important;
padding-left: 1px !important;
}
.pdf_menu .col-md-2{
padding-right: 1px !important;
padding-left: 1px !important;
}
.pdf_menu .card-text{
font-size: .85em;
color: #fff;
}
.pdf_menu .card-img-overlay{
	padding: 140px .5rem 5px !important;
}


/* footer関連
---------------------------------------------------------------------*/
footer{
	background-color: #444;
	margin-top: 8em;
}
footer a{
	margin-bottom: 5px;
	padding: 5px 1em;
	color: #fff; 
}
footer a:hover,
footer a:focus,
footer a:active {
  color: #098fdc;
  padding: 6px 1em;
   -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out; 
  text-decoration: none;
}
footer hr{
	border: 1px #666 solid;
	margin: 30px 0 15px; 
}

/* スペース関連
---------------------------------------------------------------------*/
.m25{
	margin: 25px;
}
.m50{
	margin: 50px;
}
.mTB50{
	margin-top: 50px;
	margin-bottom: 50px;
}
.mT50{
	margin-top: 50px;
}
.mB50{
	margin-bottom: 50px;
}
.m70{
	margin: 70px;
}
.mTB70{
	margin-top: 70px;
	margin-bottom: 70px;
}
.mT70{
	margin-top: 70px;
}
.mB70{
	margin-bottom: 70px;
}
.mB100{
	margin-bottom: 100px;
}
.marLR15{
	margin-left: 15px;
	margin-right: 15px;
}
.marLR30{
	margin-left: 30px;
	margin-right: 30px;
}
.marLR50{
	margin-left: 50px;
	margin-right: 50px;
}
.padTB10{
	padding-top: 10px;
	padding-bottom: 10px;
}
.padTB30{
	padding-top: 30px;
	padding-bottom: 30px;
}
.right .inner{
    margin-left: auto;
}
/* text関連
---------------------------------------------------------------------*/
.lh2{
	line-height: 2;
}
.display-A{
font-size: .85rem;
}
.display-5{
font-size: 3.1rem;
font-weight: 300;
line-height: 1.2;
}


.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
/* 色関連
---------------------------------------------------------------------*/

.green{color: #40c910;
}
.blue{color: #098fdc;
}
.orange{color: #e49c12;
}
.gray{color: #b9c0c5;
}
.grayL{color: #e6e8ea;
}

.BGgreen{
	background-color: #40c910;
}
.BGblue{
	background-color: #098fdc;
}
.BGblue1{
	background-color: #1e90ff;
}
.BGblue2{
	background-color: #6495ed;
}
.BGblue3{
	background-color: #87cefa;
}
.BGorange{
	background-color: #e49c12;
}
.BGgrayL{background-color: #e6e8ea;
}
/* 複数カラムの高さを揃える　------------------*/
.flexBOX{
	display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}


/* タブレット・PCで適応　------------------*/
@media screen and (min-width: 992px) and (max-width: 1199px) {

.mainMENU{
	padding-left: 10%;
	text-align: right !important;
}
.MENUbgTEL{
	background-color: #666;
	border-radius: 0 0 5px 5px;
	color: #fff;
	padding: .5em 1em;
	margin: -10px 30px 0 6em;
	width: 25em;
}
.display-4{
	font-size: 3rem;
}

/* カタログPDF 関連-*/
.pdf_menu .card-img-overlay{
	padding: 110px .5rem 5px !important;
}

}

/* タブレットで適応　------------------*/
@media screen and (min-width: 768px) and (max-width: 991px) {
.logo {
	height:75px;
  width: 230px;
  float: none;
  background-repeat: no-repeat;
  background-size: contain;
}
.MENUbgTEL{
	display: none;
}
.mainMENU{
	padding-left: 0%;
	text-align: right !important;
	font-size: .95em;
	margin: 10px 0 -10px 0;
}
.h-none{
	display: none;
}
.display-4{
	font-size: 2rem;
}
/* カタログPDF 関連-*/
.pdf_menu .card-img-overlay{
	padding: 130px .5rem 5px !important;}
.collapse{
display: flex!important;}
.pdf_menu .card-text{
font-size: .8em;
color: #fff;
}

footer a{
	padding: 5px;
}
}
/* スマホのみ適応　--------------------------*/
@media only screen and (max-width: 767px) {
.MENUbgTEL{
	display: none;
}
.mainMENU{
	padding-left: 0%;
	text-align: right !important;
	font-size: .95em;
	margin: 0 0 3px 0;
}
.h-none{
	display: none;
}
.nav-link{
	padding: .5rem .75rem;
}
/* カタログPDF 関連-*/
.pdf_menu .card-img-overlay{
	padding: 70px .5rem 5px !important;}
.pdf_menu .card-text{
font-size: .8em;
color: #fff;
}
}

/* 親カテゴリ　--------------------------*/
.c-link-group {
    display: flex;
    flex-wrap: wrap; /* これで折り返し可能に */
    justify-content: center;
    gap: 40px; /* カード同士の余白を均等に */
    margin-bottom: 3rem;
}

/* カード */
.c-link {
    width: calc(50% - 40px); /* PCでは2列 */
    max-width: 500px;
    text-align: center;
    border-radius: 20px;
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
    overflow: hidden;
    background: #fff;
    transition: 0.3s ease;
}

.c-link:hover {
    transform: translateY(-4px);
    box-shadow: 0px 8px 15px rgba(0,0,0,0.2);
}

/* 画像 */
.c-link img {
    width: 100%;
    height: auto;
}

/* タイトル */
.c-link p {
    font-size: 18px;
}

/* スマホ時：1列表示 */
@media (max-width: 767px) {
    .c-link {
        width: 100%; /* 1列に */
        margin: 0 auto;
    }

    .c-link-group {
        gap: 20px;
    }
}
