@charset "UTF-8";

body {
    width: 1200px;
    margin: 0;
    font-family: sans-serif;
    background-color: #e9f9f9;
}
/*事業内容タイトル*/
.zigyo{
    position: relative;
    top:0;
    left: 0;
    width: 1200px;
    height: 675px;
}

.title{
    position: absolute;
    top: 48px;
    left: -8px;
    text-align: left;
    display: flex;
    gap: 5px;
    font-size: 23px;
}

h1{
    width: 150px;
    height: 45px;  
    margin:0;    
    color: white;
    z-index: 10;
}
.naname{
    padding-left: 45px;
}
.naname1{
    padding-left: 50px;
}
.naname2{
    padding-left: 58px;
}
.naname3{
    padding-left: 70px;
}
/*本文*/

ul{
    position: absolute;
    top:380px;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 1300px;
}

.gazou1{ 
   width: 566px;
    height: 570px;
    background-color: #ccc;
    background-image: url(../images/e.JPG);
    background-size: cover;
    position: absolute;
    left: 615px;
    top: 0;
    z-index: -10;
    border-bottom-left-radius: 81% 96%;
    background-position: center;
    background-position-x: 0;
    transform-origin: center;

}

.owaku1{
    position: absolute;
    top: 0;
    left: -20px;
    width: 566px;
    height: 570px;
    border-left: 33px solid;
    border-bottom: 1px solid;
    border-bottom-left-radius: 81% 96%;
    border-color: #00E667;
    transform-origin: center;
}

/*本文配置*/
.honbun1{
    position: relative;
    top: 10px;
    left: 32px;
    height: 325px;
    width: 1165px;
    display: flex;
    flex-direction: column;
    font-size: 23px;
    font-weight: 500;
    gap: 20px;
    
}

p{
    margin: 0;
    padding: 0;
     color: #333;
    
}

.midasi{
    border-bottom: solid 3px #00E667;
}

.midasiwaku{
    position: absolute;
    top: -10px;
    left: 0;
    width: 454px;
    height: 663px;
    border-left: 75px solid;
    border-bottom: 2px solid;
    border-bottom-left-radius: 100% 100%;
    border-color: #00E667;
    transform-origin: center;
}

.midasiwaku1{
    position: absolute;
    top: -68px;
    left: -12px;
    width: 412px;
    height: 730px;
    border-left: 30px double;
    border-bottom: 1px solid;
    border-bottom-left-radius: 100% 100%;
    border-color: #00E667;
    transform-origin: center;  
}

/*設備*/
.zigyoB{
    position: relative;
    top: 0;
    left: 0;
    width: 1200px;
    height: 675px;
    transform: scale(-1,-1);
}


.titleB{
    position: absolute;
    top: 55px;
    left: -17px;
    text-align: right;
    display: flex;
    gap: 5px;
    font-size: 23px;
    width: 140px;
    height: 200px;
    transform: scale(1, 1);
    z-index: 10;
}

h1{
    width: 295px;
    height: 45px;
    margin: 0;
    color: white;
    z-index: 10;
}
.nanameB{
    padding-left: 164px;
    display: inline-block; /* ← これがないと回らない！ */
    transform: rotate(180deg)
}
.nanameB1{
    padding-left: 162px;
    display: inline-block; /* ← これがないと回らない！ */
    transform: rotate(180deg)
}
.nanameB2{
    padding-left: 149px;
    display: inline-block; /* ← これがないと回らない！ */
    transform: rotate(180deg)
}
.nanameB3{
    padding-left: 132px;
    display: inline-block; /* ← これがないと回らない！ */
    transform: rotate(180deg)
}
/*本文*/

ul{
    position: absolute;
    top:380px;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 1300px;
}

.gazouB1{ 
    width: 566px;
    height: 570px;
    background-color: #ccc;
    background-image: url(../images/h.JPG);
    background-size: cover;
    position: absolute;
    left: 700px;
    top: 0;
    z-index: -10;
    border-top-right-radius: 81% 96%;
    background-position: center;
    transform: rotate(180deg);
    transform-origin: center;
    background-position-x: -180px; 
}

.owakuB1{
    position: absolute;
    top: 0;
    left: 0;
    width: 566px;
    height: 570px;
    border-right: 30px solid;
    border-top: 1px solid;
    border-top-right-radius: 81% 96%;
    border-color: #00E667;
    transform-origin: center;
}

/*本文配置*/
.honbunB1{
   position: relative;
    top: 230px;
    left: 20px;
    height: 325px;
    width: 1070px;
    display: flex;
    flex-direction: column;
    font-size: 23px;
    font-weight: 500;
    gap: 20px;
    transform: scale(-1, -1);
    text-align: right;
}

.s1{
    position: relative;
    top:0;
    left:-55px;
    width: 870px;
}
.s2{
    position: relative;
    top:0;
    left:-47px;
    width: 870px;
}
.s3{
    position: relative;
    top:0;
    left:30px;
    width: 870px;
}
.s4{
    position: relative;
    top:0;
    left:40px;
    width: 870px;
}
.s5{
    position: relative;
    top:0;
    left:-69px;
    width: 870px;
}
.s6{
    position: relative;
    top:0;
    left:-16px;
    width: 870px;
}
.s7{
    position: relative;
    top:0;
    left:-65px;
    width: 870px;      
}
.s8{
    position: relative;
    top:0;
    left:-10px;
    width: 870px;
}
.s9{
    position: relative;
    top:0;
    left:-48px;
    width: 870px;
}
.s10{
    position: relative;
    top:0;
    left:-20px;
    width: 870px;
}

.setubi1{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi2{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi3{
    border-bottom: solid 3px #00E667;
    position:relative;
    top:0;
}
.setubi4{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi5{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi6{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi7{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi8{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi9{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}
.setubi10{
    border-bottom: solid 3px #00E667;
    position: relative;
    top:0;
}

.midasiwakuB{
    position: absolute;
    top: 0;
    left: -64px;
    width: 434px;
    height: 668px;
    border-right: 75px solid;
    border-bottom: 2px solid;
    border-bottom-right-radius: 100% 100%;
    border-color: #00E667;
    transform-origin: center;
    transform: scale(-1, 1);
    
}

.midasiwakuB1{
    position: absolute;
    top: 0;
    left: 3px;
    width: 402px;
    height: 670px;
    border-right: 31px double;
    border-bottom: 1px solid;
    border-bottom-right-radius: 100% 100%;
    border-color: #00E667;
    transform: rotate(0deg);
    transform-origin: center;
}

/*ボタン*/
.linkidou{
      position: absolute;
      top:0;
      right:-58px;
      width:80px;
      height:570px;    
}

.link{
       width:80px;
       height:570px;
       position:absolute;
       top:0;
       left:0;
       display: flex;
    flex-direction: column;
    justify-content: center; /* ボタンを中央揃え */
       align-items: center; /* 縦位置を調整 */
       gap: 0; 
}

.item {
    display: flex;
    flex-direction: column; /* ボタンの下にテキストを配置する場合 */
    align-items: center; /* 中央揃え */
}



.p4, .p5{
    display: flex; /* 縦並びにする */
    flex-direction: column; 
    justify-content: center; /* 水平方向に中央揃え */
    align-items: center; /* 縦方向も中央揃え */
    gap: 0; /* テキストとアイコンの間隔を調整 */
    width: 80px;
    height: 190px;
    text-align: center;
    font-weight: bold;
    border-radius: 0;
    color: #fff;
    border: 1px solid #094;
    box-shadow: 5px 5px  #007032;
    transition: 0.5s ease-in-out;   
    background-color: #00E667;
    cursor: pointer;
    z-index: 10;
}


.p6{
    display: flex; /* 縦並びにする */
    flex-direction: row; 
    align-items: center; /* 縦方向も中央揃え */
    width: 80px;
    height: 190px;
    text-align: center;
    font-weight: bold;
    border-radius: 0;
    color: #fff;
    border: 1px solid #094;
    box-shadow: 5px 5px  #007032;
    transition: 0.5s ease-in-out;   
    background-color: #00E667;
    cursor: pointer;
    z-index: 10;   
    gap: 0; /* 2列の間隔 */
    justify-content: center;    
    text-decoration: none;
}

.kaiten{
    transform: rotate(90deg);

}

.char{
    transform: rotate(270deg);
    display: inline-block; 
    text-decoration: underline;
}

.p4:hover,.p5:hover,.p6:hover {
	width: 80px;
    height: 190px;
        max-width: 80px;
        box-shadow: none;
	    color: #fff;
        background-color: #094;   
        transform: translate(5px, 3px); /* 動きすぎないように微調整 */

}
    .haii{
    width: 1200px;
    height: 570px;
    background-color: #494951;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -11;
    border-bottom-left-radius: 81% 96%;
    background-position: center;
    background-position-x: 0;
    transform: rotate(0deg);
    transform-origin: center;
}
