@charset "utf-8";
/*---------------------------------
	nozzless style
	created: 2021.08.05
	updated: 2025.12.18
-----------------------------------*/

/*--------------
	A
---------------*/
#A ul li,
#A ul li a {
	width: 125px;
	height: 74px;
}


/*-------------------
	B, C, D, E, F, G
----------------------*/
#B ul li, #B ul li a,
#C ul li, #C ul li a,
#D ul li, #D ul li a,
#E ul li, #E ul li a,
#F ul li, #F ul li a,
#G ul li, #G ul li a {
	width: 175px;
	height: 130px;
}

.container { position: relative; }
.information { 
    position: absolute;
    right: 100px;
    bottom: 400px;
}

.information dl {
    display: flex;
    align-items: center;
    column-gap: 10px;
    max-width: 555px;
}

.information dl dt { flex-basis: 100px; flex-shrink: 0; }
.information dl dt img { max-width: 100%; }

.information dl dd {
    font-family: "Noto Sans", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    position: relative;
    display: inline-block;
    margin-left: 20px;
    padding: 16px;
    border: 2px solid #000000;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 2px crimson;
    background-color: #ffffff;
    text-align: left;
    line-height: 1.6;
}

.information dl dd::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  border-style: solid;
  border-width: 0 20px 20px 0;
  border-color: transparent #000000 transparent transparent;
  translate: -100% -50%;
}

.information dl dd::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  border-style: solid;
  border-width: 0 15.2px 15.2px 0;
  border-color: transparent #ffffff transparent transparent;
  translate: -100% calc(-50% - 0.4px);
}


@media screen and ( max-width: 1230px ){
    .information {  right: 50px !important;  }
}

@media screen and ( max-width: 1175px ){
    .information dl {  max-width: 500px; }
}

@media screen and ( max-width: 1130px ){
    .information dl {  max-width: 450px; }
}

@media screen and ( max-width: 1080px ){
    .information {  right: 30px !important;  }
    .information dl {  max-width: 400px; }
}

/* -Tablet- 600px-1024px */
@media screen and (max-width: 1025px){
	
	/*-------------------
		A, B, C, D, E, F, G
	----------------------*/
	#A ul li, #A ul li a,
	#B ul li, #B ul li a,
	#C ul li, #C ul li a,
	#D ul li, #D ul li a,
	#E ul li, #E ul li a,
	#F ul li, #F ul li a,
	#G ul li, #G ul li a {
		height: auto;
	}
    
    .information dl {  max-width: 350px; }
}

@media screen and (max-width: 1024px){
    .information {  
        position: relative;
        bottom: 0;
        right: 0;
        margin: 30px 0 0 30px;
    }
    
    .information dl {  max-width: 100%; }
}

/* -SP- -599px */
@media screen and (max-width: 599px){
}