@charset "UTF-8";
/*
    Template: swell
    Theme Name: rinia
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

@import url("./css/page.css");


.smp{display: none!important;} 
.tablet{display: none!important;}

@media screen and (min-width:641px) and (max-width:1024px){
	.pc{display: none!important;} 
	.smp{display: none!important;}
}

@media screen and (max-width:641px){
	.pc{display: none!important;}
	.tablet{display: none!important;} 
}


*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.cf:before,.cf:after{content:"";display:block;overflow:hidden;}
.cf:after{clear:both;}
.cf{zoom:1;}

.wrap{max-width: 1200px; margin: 0 auto;}


.top .l-content{margin: 0 auto; z-index: 2;}

@media screen and (max-width:641px){
    .top .l-content{padding-top: 2em !important;}
}


/*  header
-----------------------------------*/
.l-header__bar{display: none;}
.top .l-container{max-width: none; padding: 0;}
.l-header{height: 80px;}
.l-header__inner{height: 100%;}
.-series .l-header__logo{padding: 0 0 0 5%;}

.l-fixHeader__logo{padding: 11px 0 11px 5%;}

.c-gnav > .menu-item a{padding: 0 23px;}
.c-gnav > .menu-item:last-child a{color: #fff; background: #040456;}
.c-gnav > .menu-item:last-child i{margin-right: 8px;}


@media screen and (min-width:641px) and (max-width:1024px){
    .-series .l-header__logo {padding: 0 0 0 3%;}
     .c-headLogo {height: 76px;}
    .c-iconBtn__icon {font-size: 40px; margin-right: 15px; color: #040456;}
    
    .p-spMenu__inner{padding-top: 100px;}
    .p-spMenu__inner::before {background: #040456;}
    .-right .p-spMenu__closeBtn .c-iconBtn__icon{color: #fff; font-size: 25px;}
    .p-spMenu .c-widget__title {display: none;}
    .c-listMenu a {padding: 1.75em 1em 1.75em 2.0em; color: #fff;}
    .c-listMenu.c-listMenu li:last-child i{display: none;}
}


@media screen and (max-width:641px){
    .l-header {height: 65px;}
    .-series .l-header__logo {padding: 0 0 0 3%;}
    .-img .c-headLogo__link {padding: 5px 0;} 
    .c-iconBtn__icon {font-size: 35px; color: #040456;}
    
    .p-spMenu__inner{padding-top: 100px;}
    .p-spMenu__inner::before {background: #040456;}
    .-right .p-spMenu__closeBtn .c-iconBtn__icon{color: #fff;}
    .p-spMenu .c-widget__title {display: none;}
    .c-listMenu a {padding: 1.75em 1em 1.75em 2.0em; color: #fff;}
    .c-listMenu.c-listMenu li:last-child i{display: none;}
}

/*  mainimg
-----------------------------------*/
.mainCatch{
    font-family: 'Noto Serif JP';
    font-size: clamp(45px,4.5vw,60px); 
    color: #fff;
    line-height: 1.6em;
    letter-spacing: 4px;
    padding-left:0;
    text-indent:-2em;
    writing-mode: vertical-rl;
    z-index: 2;
    position: absolute;
    top: 44%;
    left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.left_man{
    position: absolute;
    bottom: 6px;
    left: 95px;
    z-index: 3;
}
.right_man{
    position: absolute;
    bottom: 2px;
    right: 95px;
    z-index: 3;
}

@media screen and (min-width:641px) and (max-width:1024px){
    .p-mainVisual {
        background-image: url('https://rinia.jp/wp/wp-content/uploads/2025/08/mainimg02.jpg');
        background-size: contain;
        background-position: top center;
        background-repeat: no-repeat;
  }
    .p-mainVisual__imgLayer{display: none;}
    .p-mainVisual__inner {height: 50vh;}
    .mainCatch{font-size: 30px; top: 40%; }
    .left_man {bottom: 35px; left: 52px;}
    .right_man {bottom: 39px; right: -2px;}
    .left_man img, .right_man img{width: 60%;}

}

@media screen and (max-width:641px){
    .mainCatch{font-size: 35px;}
    .left_man {bottom: -4px; left: 27px;}
    .right_man{bottom: -5px; right: -30px;}
    .left_man img, .right_man img{width: 60%;}
}



/*  footer
-----------------------------------*/
.l-footer{background: #fff;}
.l-footer .outer{height: 400px;}
.l-footer .comInfo{float: left; width: 50%; padding: 40px 0 0 10%;}
.l-footer .name{font-size: 24px; font-weight: bold;}
.l-footer .sml{font-size: 16px;}
.l-footer .tel{margin: 11px 0 0 0;}
.l-footer .tel a{font-size: 30px; font-weight: bold;}
.l-footer .tel img{margin-right: 8px;}
.l-footer .time{margin-bottom: 20px;}

.l-footer ul{display: flex; margin-top: 45px;}
.l-footer ul li{width: 30%; border-right: 1px solid #222; padding: 0 3%; text-align: center;}
.l-footer ul li:first-child{padding-left: 0;}
.l-footer ul li:last-child{border-right: none;}
.l-footer ul li a{font-size: 14px;}

.l-footer .map{float: right; width: 50%;}
.copy{padding: 10px 0; background: #040456; color: #fff; font-size: 12px; text-align: center;}

@media screen and (min-width:641px) and (max-width:1024px){
    .l-footer .comInfo {padding: 40px 0 0 3%;}
    .l-footer .name {font-size: 21px;}
    .l-footer .tel a {font-size: 27px;}
    
    .l-footer ul li {width: 45%; text-align: center;}
    .l-footer ul li a {font-size: 13px;}
}

@media screen and (max-width:641px){
    .l-footer .outer {height: auto;}
    .l-footer .comInfo {float: none; width: 100%; padding: 40px 5% 0;}
    .l-footer .name {font-size: 18px; text-align: center;}
    .l-footer .add {text-align: center; padding-top: 10px;}
    .l-footer .tel {text-align: center;}
    .l-footer .tel a {font-size: 27px;}
    .l-footer .tel a:hover{text-decoration: underline;}
    .l-footer .time{text-align: center;}
    .l-footer ul {justify-content: center;}
    .l-footer ul li {width: 42%; text-align: center;}
    .l-footer ul li a {font-size: 12px;}
    .l-footer .map {float: none; width: 100%; margin-top: 2em;}
    .l-footer .map iframe{height: 300px;}
    
    .copy{font-size: 10px;}
    
    #fix_bottom_menu .menu_list{padding: 0; height: 55px;}
	#fix_bottom_menu .menu-item{border-top: 1px solid #fff;	border-right: 1px solid #fff; height: 100%;}
	#fix_bottom_menu .menu-item:last-child{border-right: none;}
	#fix_bottom_menu .menu-item a{height: 100%;	padding-top: 10px;}
}


/*  button
-----------------------------------*/
.btn{
    /*アニメーションの起点とするためrelativeを指定*/
    position: relative;
	overflow: hidden;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
    width: 400px;
   	border: 1px solid #707070;/* ボーダーの色と太さ */
    padding: 15px 30px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/   
    transition: ease .2s;
}

/*ボタン内spanの形状*/
.btn span {
	position: relative;
	z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
    font-size: 20px;
}

.btn:hover span{
	color:#fff;
}

/*== 背景が流れる（上から下） */
.bgtop:before {
 	content: '';
    /*絶対配置で位置を指定*/
 	position: absolute;
 	top:0;
 	left: 0;
 	z-index: 2;
    /*色や形状*/
 	background:  #333;/*背景色*/
 	width: 100%;
	height: 0;
    /*アニメーション*/
 	transition:.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

/*hoverした際の形状*/
.bgtop:hover:before{
	 height: 100%;	
 	 background-color: #333;
}


.recBtn{text-align: center;}
.btn-b{
    /*アニメーションの起点とするためrelativeを指定*/
    position: relative;
	overflow: hidden;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
    width: 400px;
   	border: 1px solid #040456;/* ボーダーの色と太さ */
    background: #040456;
    padding: 15px 30px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/   
    transition: ease .2s;
}

/*ボタン内spanの形状*/
.btn-b span {
	position: relative;
	z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
    font-size: 20px;
    color: #fff;
}

.btn-b:hover span{
	color:#040456;
}

/*== 背景が流れる（斜め） */
.bgskew::before {
	content: '';
    /*絶対配置で位置を指定*/
	position: absolute;
	top: 0;
	left: -130%;
    /*色や形状*/
	background:#fff;
	width:120%;
	height: 100%;
	transform: skewX(-25deg);
}

/*hoverした時のアニメーション*/
.bgskew:hover::before {
	animation: skewanime .5s forwards;/*アニメーションの名前と速度を定義*/
}

@keyframes skewanime {
	100% {
		left:-10%;/*画面の見えていない左から右へ移動する終了地点*/
	}
}


@media screen and (min-width:641px) and (max-width:1024px){
    .btn{width: 310px; padding: 15px 15px;}
    .btn span {font-size: 16px;}
}

@media screen and (max-width:641px){
    .btn {display: block; width: 85%; padding: 15px 15px; margin: 0 auto;}
    .btn span {font-size: 15px;}
    
    .btn-b {width: 85%; padding: 10px 15px;}
    .btn-b span{font-size: 16px;}
}

/*  お知らせ
-----------------------------------*/
.top-info{margin-bottom: 4em;}
.top-list .p-postList__body{
    border-top: 1px solid var(--color_border);
    border-bottom: 1px solid var(--color_border);    
    padding: 0 1.5em;
}
.top-list .p-postList__body:hover{background: rgba(204,204,204,0.40);}
.top-list .catName{font-size: 14px; color: #fff; background: #040456; padding: 3px 13px; border-radius: 10px; display: inline-block; }
.top-list .catName a{color: #fff;}
.top-list .catName i{margin-right: 5px;}
.top-list .ttlBox{display: inline-block; width: 80%;}
.top-list .ttlBox a{display: block; padding: 1.5em 0;}
.top-list .postDate{font-size: 14px; color: #040456; padding: 0 20px; margin: 0 20px; border-right: 1px solid #ccc; border-left: 1px solid #ccc; display: inline-block;}
.top-list .postTitle{font-weight: normal!important; font-size: 17px!important; margin: 0; display: inline-block; }



@media screen and (min-width:641px) and (max-width:1024px){
    .p-postList__title {font-size: 17px !important;}
    .-type-simple .p-postList__link{padding: 0.5em .25em;}
}



@media screen and (max-width:641px){
    .top-list .p-postList__body {padding: 1em 0.7em;}
    .top-list .catName {font-size: 13px;}
    .top-list .ttlBox {width: 100%;}
    .top-list .ttlBox a {padding: 1.1em 0 0.8em;}
    .top-list .postDate {padding: 0 14px 0 0; margin: 0 12px 0 0; border-left: none;}
    .top-list .postTitle{font-size: 15px!important;}
}

/*  業務3box
-----------------------------------*/
.service-area{padding-top: 2em !important; padding-bottom: 9em !important;}
.service-area .swell-block-column{position: relative;}

.swell-block-bannerLink{
    border: 6px solid #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.1);
}
.c-bannerLink__title{
    font-size: clamp(35px,3.5vw,40px)!important;
    letter-spacing: 3px !important;
    margin: 4em 0 4px;
    text-shadow: 2px 2px 3px #000;
}
.c-bannerLink__description{
    text-shadow: 2px 2px 3px #000;
}
.arrow-down{
    position: absolute;
    top: 70%;
    left: 50%;    
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}




@media screen and (min-width:641px) and (max-width:1024px){
   .c-bannerLink__title {font-size: 26px !important;}
    .arrow-down img{width: 35px;}
}


@media screen and (max-width:641px){
    .service-area {
        padding-bottom: 8em !important;
        padding-top: 2em !important;
    } 
    
    .arrow-down img{width: 35px;}
}