@charset "utf-8";

:root {
  --color-main: #222222;
  --color-brand_purple: #551B48;
  --color-skyblue: #3FB0CC;
  --color-orange: #F58200;
  --color-olive: #A79137;
  --color-green: #83A629;
  --color-gray: #F5F5F5;
  --color-navy: #242B78;
  --color-turquoise: #00AFCC;
  --font-sans: "Noto Sans JP", sans-serif;
}

/* ----- about.php ----- */

main.about h3.about_h3 {
  margin-top: min(4rem, 40px);
  font-size: min(7rem, 70px);
  font-weight: 600;
  color: var(--color-brand_purple);
  letter-spacing: -.04em;
  text-align: center;
}

main.about p.about_lead {
  margin-top: min(2rem, 20px);
  font-size: min(2.5rem, 25px);
  font-weight: 700;
  text-align: center;
  line-height: 1.6;
}

main.about p.about_lead span {
  font-size: min(3.5rem, 35px);
  font-weight: 700;
  color: var(--color-brand_purple);
}

main.about p.about_txt {
  margin-top: min(4rem, 40px);
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 2.2;
  text-align: center;
}

main.about div.about_wrap {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: min(4rem, 40px);
}

main.about div.about_wrap h4.about_h4 {
  width: calc((100% - min(4rem, 40px)) / 2);
  font-size: min(7.0rem, 70px);
  color: #909090;
  text-align: right;
}

main.about div.about_wrap div.desc_area {
  flex: 1;
}

main.about div.about_wrap div.desc_area p.about_desc {
  font-size: min(2rem, 20px);
  font-weight: 500;
  line-height: 1.8;
}

main.about section.mission {
  background-image: url(../images/about/top/bg_mission.png);
  background-size: min(220rem, 2200px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.about section.vision {
  background-image: url(../images/about/top/bg_vision.png);
  background-size: min(220rem, 2200px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.about section.vision div.about_wrap {
  flex-direction: row-reverse;
}

main.about section.vision div.about_wrap h4.about_h4 {
  text-align: left;
}

@media (max-width: 799px) {
  main.about h3.about_h3 {
    margin-top: 2rem;
    font-size: 4.5rem;
    letter-spacing: -.04em;
    line-height: 1.2;
  }
  
  main.about p.about_lead {
    margin-top: 2rem;
    font-size: 1.8rem;
    line-height: 2.0;
  }
  
  main.about p.about_lead span {
    font-size: 2.4rem;
  }
  
  main.about p.about_txt {
    margin-top: 2rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.2;
    text-align: left;
  }
  
  main.about div.about_wrap {
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: 2rem;
  }
  
  main.about div.about_wrap h4.about_h4 {
    width: 100%;
    font-size: 4rem;
    text-align: center;
  }
  
  main.about div.about_wrap div.desc_area {
    flex: none;
    width: 100%;
  }
  
  main.about div.about_wrap div.desc_area p.about_desc {
    font-size: 1.8rem;
    line-height: 1.8;
  }
  
  main.about section.mission {
    background-image: url(../images/about/top/bg_mission_sp.png);
    background-size: 100%;
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.about section.vision {
    background-image: url(../images/about/top/bg_vision_sp.png);
    background-size: 100%;
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.about section.vision div.about_wrap {
    flex-direction: column;
  }
  
  main.about section.vision div.about_wrap h4.about_h4 {
    text-align: center;
  }
}

/* ----- page-establishment.php ----- */

main.establishment section.inner_mv {
  background-image: url(../images/about/establishment/bg_mv_establishment.png);
}


main.establishment .establishment_vision{
  background-image: url(../images/about/establishment/bg_vision.jpg);
  background-size: cover;
  background-position: bottom left;
  background-repeat: no-repeat;
  margin-top:50px;
  padding: min(5vw, 50px);
  position:relative;
}
main.establishment .establishment_vision::after{
	content:"";
	background-image: linear-gradient(to right, rgb(255 255 255 / 20%) 0%, rgb(255 255 255 / 90%) 100%);
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}
main.establishment .establishment_vision_txt{
	position:relative;
	z-index:10;
}
main.establishment .establishment_vision_txt h3{
	font-size: min(4.2vw, 42px);
	font-weight:bold;
}
main.establishment .establishment_vision_txt .common_txt{
	font-size: min(2.2vw, 22px);
	font-weight:bold;
}
@media(max-width: 799px){
	main.establishment .establishment_vision_txt h3{
		font-size: 24px;
	}
}
@media(max-width: 799px){
main.establishment .establishment_vision_txt .common_txt{
	font-size: 16px;
}
}

/* ----- page-greeting.php ----- */

main.greeting section.greeting_mv {
  background-image: url(../images/about/greeting/bg_greeting.png);
  background-size: min(204rem, 2080px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.greeting section.greeting_mv div.greeting_wrap {
  display: flex;
  align-items: start;
  gap: 0;
}

main.greeting section.greeting_mv div.greeting_wrap div.txt_area {
  flex: 1;
}

main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.greeting_lead {
  margin-top: min(4rem, 40px);
  font-size: min(2.5rem, 25px);
  line-height: 1.6;
  font-weight: 700;
}

main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_position {
  margin-top: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  gap: min(.4rem, 4px);
}

main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_position span {
  font-size: min(1.2rem, 12px);
}

main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_name {
  margin-top: min(2rem, 20px);
  width: min(20rem, 200px);
}

main.greeting section.greeting_mv div.greeting_wrap div.img_area {
  width: min(45rem, 450px);
}

main.greeting section.greeting_message {
  background-color: var(--color-gray);
}

@media (max-width: 799px) {
  main.greeting section.greeting_mv {
    background-image: none;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap {
    flex-direction: column-reverse;
    gap: 2rem;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.txt_area {
    flex: none;
    width: 100%;
    background-image: url(../images/about/greeting/bg_greeting_sp.png);
    background-size: 100%;
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.greeting_lead {
    margin-top: 2rem;
    font-size: 1.8rem;
    line-height: 1.6;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_position {
    margin-top: 2rem;
    gap: .4rem;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_position span {
    font-size: 1.2rem;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.txt_area p.chief_name {
    margin-top: 2rem;
    width: 16rem;
  }
  
  main.greeting section.greeting_mv div.greeting_wrap div.img_area {
    width: calc(100% + 4rem);
    margin-left: -2rem;
    margin-right: -2rem;
  }
  
  main.greeting section.greeting_message {
    background-color: var(--color-gray);
  }
}

/* ----- outline.php ----- */

main.outline section.inner_mv  {
  background-image: url(../images/about/outline/bg_mv_outline.jpg);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.outline section.journey div.journey_wrap {
  margin-top: min(4rem, 40px);
  display: flex;
  align-items: start;
  gap: min(4rem, 40px);
}

main.outline section.journey div.journey_wrap div.txt_area {
  flex: 1;
}

main.outline section.journey div.journey_wrap div.txt_area p.common_txt {
  letter-spacing: 0.04em;
}

main.outline section.journey div.journey_wrap div.img_area {
  width: min(46rem, 460px);
}

@media (max-width: 799px) {
  main.outline section.inner_mv  {
    background-image: url(../images/about/outline/bg_mv_outline.jpg);
    background-size: min(400rem, 4000px);
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.outline section.journey div.journey_wrap {
    margin-top: 4rem;
    flex-direction: column-reverse;
    align-items: start;
    gap: 2rem;
  }
  
  main.outline section.journey div.journey_wrap div.txt_area {
    flex: none;
    width: 100%;
  }
  
  main.outline section.journey div.journey_wrap div.img_area {
    width: calc(100% + 4rem);
    margin-left: -2rem;
    margin-right: -2rem;
  }
}

main.outline section.outline {
  background-color: var(--color-gray);
}

main.outline section.outline dl.outline_dl {
  margin-top: min(4rem, 40px);
}

main.outline section.outline dl.outline_dl div.outline_dl_item {
  padding: min(2rem, 20px);
  border-bottom: min(0.1rem, 1px) solid #707070;
  display: flex;
  align-items: start;
  gap: 0;
}

main.outline section.outline dl.outline_dl div.outline_dl_item:first-of-type {
  padding-top: 0;
}

main.outline section.outline dl.outline_dl div.outline_dl_item dt.outline_dt {
  width: min(15rem, 150px);
  font-size: min(1.4rem, 14px);
  font-weight: 700;
  line-height: 1.2;
}

main.outline section.outline dl.outline_dl div.outline_dl_item dd.outline_dd { 
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: min(0.8rem, 8px);
}

main.outline section.outline dl.outline_dl div.outline_dl_item dd.outline_dd span {
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 1.2;
}

@media (max-width: 799px) {
  main.outline section.outline dl.outline_dl {
    margin-top: 4rem;
  }
  
  main.outline section.outline dl.outline_dl div.outline_dl_item {
    padding: 2rem 0;
    border-bottom: .1rem solid #707070;
    flex-direction: column;
    align-items: start;
    gap: .8rem;
  }
  
  main.outline section.outline dl.outline_dl div.outline_dl_item dt.outline_dt {
    width: 100%;
    font-size: 1.4rem;
  }
  
  main.outline section.outline dl.outline_dl div.outline_dl_item dd.outline_dd { 
    flex: none;
    width: 100%;
    gap: 0.4rem;
  }

  main.outline section.outline dl.outline_dl div.outline_dl_item dd.outline_dd span {
    font-size: 1.3rem;
    line-height: 1.4;
    padding-left: 1em;
    text-indent: -1em;
  }
}

main.outline section.outline.activity {
  background-color: #fff;
}

main.outline section.history {
  background-color: var(--color-gray);
}

main.outline section.history dl.history_dl {
  margin-top: min(4rem, 40px);
}

main.outline section.history dl.history_dl div.history_item {
  display: flex;
  align-items: start;
  gap: 0;
}

main.outline section.history dl.history_dl div.history_item dt.history_dt {
  width: min(13rem, 130px);
  font-size: min(3.0rem, 30px);
  font-weight: 700;
  font-family: var(--font-roboto);
  color: #C6C6C6;
  padding-top: min(2rem, 20px);
}

main.outline section.history dl.history_dl div.history_item dt.history_dt:empty {
  opacity: 0;
  pointer-events: none;
  min-height: min(3rem, 30px);
}

main.outline section.history dl.history_dl div.history_item dd.history_dd {
  flex: 1;
  display: flex;
  align-items: start;
  gap: min(2rem, 20px);
  padding: min(2rem, 20px) 0;
  border-bottom: min(0.1rem, 1px) solid #DEDEDE;
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 1.6;
}

main.outline section.history dl.history_dl div.history_item dd.history_dd strong {
  line-height: 1.6;
}

main.outline section.history dl.history_dl div.history_item dd.history_dd span {
  width: min(5.5rem, 55px);
  font-size: min(1.6rem, 16px);
  font-weight: 700;
  line-height: 1.6;
  flex-shrink: 0;
  text-align: right;
}

@media (max-width: 799px) {
  main.outline section.history dl.history_dl {
    width: 100%;
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
    gap: 0rem;
  }
  
  main.outline section.history dl.history_dl div.history_item {
    width: 100%;
    flex-direction: column;
    align-items: start;
    gap: 0;
  }
  
  main.outline section.history dl.history_dl div.history_item dt.history_dt {
    width: 100%;
    font-size: 2.4rem;
    padding-top: 0;
    margin-top: 4rem;
  }
  
  main.outline section.history dl.history_dl div.history_item dt.history_dt:empty {
    display: none;
  }
  
  main.outline section.history dl.history_dl div.history_item dd.history_dd {
    flex: none;
    width: 100%;
    gap: 1rem;
    padding: 2rem 0;
    border-bottom: .1rem solid #DEDEDE;
    font-size: 1.4rem;
    line-height: 1.6;
  }
  
  main.outline section.history dl.history_dl div.history_item dd.history_dd span {
    width: 4rem;
    font-size: 1.4rem;
    line-height: 1.6;
    text-align: right;
    flex-shrink: 0;
  }
}

/* ----- member.php ----- */

main.member section.inner_mv {
  background-image: url(../images/about/member/bg_mv_member.jpg);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.member section.member_area {
  background-color: var(--color-gray);
}

main.member section.member_area h3.member_h3 {
  margin: min(8rem, 80px) auto 0;
  font-size: min(2.0rem, 20px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  white-space: nowrap;
}

main.member section.member_area h3.member_h3::before,
main.member section.member_area h3.member_h3::after {
  content: "";
  width: 50%;
  height: min(.2rem, 2px);
  border-bottom: min(.2rem, 2px) dotted var(--color-main);
  margin-right: min(2rem, 20px);
}

main.member section.member_area h3.member_h3::after {
  margin-right: 0;
  margin-left: min(2rem, 20px);
}

main.member section.member_area div.member_box {
  margin: min(4rem, 40px) auto 0;
  width: 100%;
  padding: min(4rem, 40px);
  background-color: #fff;
}

main.member section.member_area div.member_info {
  display: flex;
  align-items: start;
  gap: min(4rem, 40px);
}

main.member section.member_area div.member_info div.img_area {
  width: min(16rem, 160px);
  height: min(16rem, 160px);
  background-color: #F0F0F0;
}

main.member section.member_area div.member_info div.img_area img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

main.member section.member_area div.member_info div.txt_area {
  flex: 1;
}

main.member section.member_area div.member_info div.txt_area p.member_name {
  display: flex;
  align-items: end;
  gap: min(1rem, 10px);
}

main.member section.member_area div.member_info div.txt_area p.member_name span {
  font-size: min(2.0rem, 20px);
  font-weight: 700;
}

main.member section.member_area div.member_info div.txt_area p.member_name small {
  font-size: min(1.4rem, 14px);
  font-weight: 400;
  font-family: var(--font-serif);
}

main.member section.member_area div.member_info div.txt_area p.member_position {
  margin-top: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  gap: min(0.8rem, 8px);
}

main.member section.member_area div.member_info div.txt_area p.member_position span {
  font-size: min(1.2rem, 12px);
  font-weight: 400;
}

main.member section.member_area div.member_info div.txt_area a.member_link {
  margin-top: min(2rem, 20px);
  font-size: min(1.4rem, 14px);
  font-weight: 500;
  width: min(16.5rem, 165px);
  height: min(3.5rem, 35px);
  padding: 0 min(1rem, 10px);
  background-color: #fff;
  border: min(0.1rem, 1px) solid var(--color-main);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

main.member section.member_area div.member_info div.txt_area a.member_link::after {
  content: "";
  background-image: url(../images/about/member/icon_arrow_member.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: min(.8rem, 8px);
  height: min(.8rem, 8px);
}

main.member section.member_area h4.member_h4 {
  margin-top: min(4rem, 40px);
  border-bottom: min(0.1rem, 1px) solid #DEDEDE;
}

main.member section.member_area h4.member_h4 span {
  width: fit-content;
  padding: min(0.8rem, 8px) min(2rem, 20px);
  background-color: #DEDEDE;
  font-size: min(1.4rem, 14px);
  font-weight: 700;
}

main.member section.member_area .member_desc {
  margin-top: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  gap: min(1rem, 10px);
}

main.member section.member_area .member_desc span {
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 1.6;
}

main.member section.member_area .member_desc a {
  font-size: min(1.4rem, 14px);
  text-decoration: underline;
}

main.member section.member_area ul.member_edit {
  margin-top: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  gap: min(1rem, 10px);
}

main.member section.member_area ul.member_edit li {
  display: grid;
  width: calc(100% - 10px);
  grid-auto-rows: auto;
  grid-template-columns: 15% 85%;
}

main.member section.member_area ul.member_edit span {
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 1.6;
}


@media (max-width: 799px) {
  
  main.member section.inner_mv {
    background-image: url(../images/about/member/bg_mv_member.jpg);
    background-size: cover;
  }
  
  main.member section.member_area h3.member_h3 {
    margin: 8rem auto 0;
    font-size: 2rem;
    white-space: nowrap;
    line-height: 1.2;
    text-align: center;
  }
  
  main.member section.member_area h3.member_h3::before,
  main.member section.member_area h3.member_h3::after {
    content: "";
    width: 50%;
    height: 0.2rem;
    border-bottom: .2rem dotted var(--color-main);
    margin-right: 2rem;
  }
  
  main.member section.member_area h3.member_h3::after {
    margin-right: 0;
    margin-left: 2rem;
  }
  
  main.member section.member_area div.member_box {
    margin: 4rem auto 0;
    width: 100%;
    padding: 2rem;
  }
  
  main.member section.member_area div.member_info {
    flex-direction: column;
    align-items: start;
    gap: 2rem;
  }
  
  main.member section.member_area div.member_info div.img_area {
    width: 100%;
    height: 29.5rem;
  }
  
  main.member section.member_area div.member_info div.txt_area {
    flex: none;
    width: 100%;
  }
  
  main.member section.member_area div.member_info div.txt_area p.member_name {
    gap: 1rem;
  }
  
  main.member section.member_area div.member_info div.txt_area p.member_name span {
    font-size: 2rem;
  }
  
  main.member section.member_area div.member_info div.txt_area p.member_name small {
    font-size: 1.4rem;
  }
  
  main.member section.member_area div.member_info div.txt_area p.member_position {
    margin-top: 2rem;
    gap: 0.8rem;
  }
  
  main.member section.member_area div.member_info div.txt_area p.member_position span {
    font-size: 1.2rem;
    line-height: 1.2;
  }

  main.member section.member_area div.member_info div.txt_area p.member_position a {
    line-height: 1.4;
    overflow-wrap: break-word;
    word-break: break-all;
    white-space: normal;
  }
  
  main.member section.member_area div.member_info div.txt_area a.member_link {
    margin: 2rem auto 0;
    font-size: 1.4rem;
    width: 16rem;
    height: 3.5rem;
    padding: 0 1rem;
    border: 0.1rem solid var(--color-main);
  }
  
  main.member section.member_area div.member_info div.txt_area a.member_link::after {
    width: 0.8rem;
    height: 0.8rem;
  }
  
  main.member section.member_area h4.member_h4 {
    margin-top: 4rem;
    border-bottom: .1rem solid #DEDEDE;
  }
  
  main.member section.member_area h4.member_h4 span {
    padding: .8rem 2rem;
    font-size: 1.4rem;
  }
  
  main.member section.member_area .member_desc {
    margin-top: 2rem;
    gap: 1rem;
  }
  
  main.member section.member_area .member_desc span {
    font-size: 1.4rem;
    line-height: 1.6;
  }
  
  main.member section.member_area .member_desc a {
    font-size: 1.4rem;
    overflow-wrap: break-word;
    word-break: break-all;
    white-space: normal;
    line-height: 1.4;
  }
		
		main.member section.member_area ul.member_edit {
				margin-top: 2rem;
				gap:1rem;
		}

		main.member section.member_area ul.member_edit li {
				grid-auto-columns: auto;
		}

		main.member section.member_area ul.member_edit span {
				grid-column: 1 / 3;
		}
		main.member section.member_area ul.member_edit span.affiliation {
				font-size: 1.2rem;
		}
}

/* ----- why.php ----- */

main.why section.inner_mv {
  background-image: url(../images/about/why/bg_mv_why.jpg);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.why section.why_lead div.why_lead_wrap {
  display: flex;
  align-items: start;
  gap: min(4rem, 40px);
}

main.why section.why_lead div.why_lead_wrap div.img_area {
  width: min(37rem, 370px);
}

main.why p.why_txt {
  flex: 1;
  margin-top: min(4rem, 40px);
  display: flex;
  flex-direction: column;
  gap: min(2rem, 20px);
}

main.why p.why_txt span {
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  line-height: 2.2;
}

main.why section.why_content  {
  background: #F5F5F5;
}

main.why section.why_content ul.term_list {
  margin-top: min(4rem, 40px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

main.why section.why_content ul.term_list li.term_item {
  padding: min(2.4rem, 24px);
  border-right: min(0.4rem, 4px) solid #fff;
  border-bottom: min(0.4rem, 4px) solid #fff;
  font-size: min(1.6rem, 16px);
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: min(2rem, 20px);
}

main.why section.why_content ul.term_list li.term_item:nth-child(3n) {
  border-right: none;
}

main.why section.why_content ul.term_list li.term_item:nth-last-child(-n+3) {
  border-bottom: none;
}

main.why section.why_content ul.term_list li.term_item::before {
  content: "";
  background-image: url(../images/about/why/icon_check_l.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: min(3.4rem, 34px);
  height: min(3.4rem, 34px);
  flex-shrink: 0;
}

main.why section.why_content ul.desc_list {
  margin-top: min(8rem, 80px);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: min(2rem, 20px);
}

main.why section.why_content ul.desc_list li.desc_item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  background-color: #fff;
}

main.why section.why_content ul.desc_list li.desc_item h3.desc_ttl {
  width: 100%;
  height: min(3rem, 30px);
  padding: 0 min(1rem, 10px);
  background-color: #7E6879;
  display: flex;
  align-items: center;
  gap: min(1rem, 10px);
  font-size: min(1.4rem, 14px);
  font-weight: 700;
  color: #fff;
}

main.why section.why_content ul.desc_list li.desc_item h3.desc_ttl::before {
  content: "";
  background-image: url(../images/about/why/icon_check_s.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: min(1.7rem, 17px);
  height: min(1.4rem, 14px);
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area {
  padding: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(2rem, 20px);
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area.character {
  flex-direction: row;
  align-items: center;
  gap: min(1rem, 10px);
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area.character div.icon_area {
  width: min(12rem, 120px);
  flex-shrink: 0;
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area.character p.common_txt strong {
  display: block;
  margin-bottom: min(1rem, 10px);
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area p.desc_txt {
  font-size: min(2rem, 20px);
  font-weight: 700;
}

main.why section.why_content ul.desc_list li.desc_item div.desc_area div.desc_image {
  width: min(42rem, 420px);
}

@media (max-width: 799px) {
  main.why section.inner_mv {
    background-image: url(../images/about/why/bg_mv_why.jpg);
    background-size: cover;
  }
  
  main.why section.why_lead div.why_lead_wrap {
    flex-direction: column-reverse;
    align-items: center;
    gap: 2rem;
  }
  
  main.why section.why_lead div.why_lead_wrap div.img_area {
    width: 75%;
    margin: 0 auto;
  }
  
  main.why p.why_txt {
    flex: none;
    width: 100%;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
  
  main.why p.why_txt span {
    font-size: 1.4rem;
    line-height: 2.2;
  }
  
  main.why section.why_content ul.term_list {
    margin-top: 4rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  
  main.why section.why_content ul.term_list li.term_item {
    padding: 1rem;
    border-right: .2rem solid #fff;
    border-bottom: .2rem solid #fff;
    font-size: 1.4rem;
    gap: 1rem;
    line-height: 1.2;
  }
  
  main.why section.why_content ul.term_list li.term_item:nth-child(2),
  main.why section.why_content ul.term_list li.term_item:nth-child(4),
  main.why section.why_content ul.term_list li.term_item:nth-child(8) {
    border-right: none;
  }

  main.why section.why_content ul.term_list li.term_item:nth-child(3) {
    border-right: .2rem solid #fff;
  }

  main.why section.why_content ul.term_list li.term_item:nth-last-child(2),
  main.why section.why_content ul.term_list li.term_item:nth-last-child(3) {
    border-bottom: .2rem solid #fff;
  }
  
  main.why section.why_content ul.desc_list {
    margin-top: 4rem;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item {
    display: block;
    background-color: #fff;
  }
  
  main.why section.why_content ul.desc_list li.desc_item h3.desc_ttl {
    width: 100%;
    height: 2.5rem;
    padding: 0.8rem;
    gap: 0.8rem;
    font-size: 1.2rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item h3.desc_ttl::before {
    width: 1.4rem;
    height: 1.2rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area {
    padding: 3rem 1rem;
    gap: 2rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area.character {
    flex-direction: row;
    align-items: center;
    gap: 1rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area.character div.icon_area {
    width: 8rem;
    flex-shrink: 0;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area.character p.common_txt strong {
    display: block;
    margin-bottom: 1rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area p.desc_txt {
    font-size: 1.4rem;
  }
  
  main.why section.why_content ul.desc_list li.desc_item div.desc_area div.desc_image {
    width: 85%;
  }

  main.why section.why_content p.why_txt {
    margin-top: 4rem;
  }
}

/* ----- brandManager.php ----- */

main.brandManager section.inner_mv {
  background-image: url(../images/about/brandManager/bg_mv_brandManager.jpg);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.brandManager div.brandManager_wrap {
  margin-top: min(4rem, 40px);
  display: grid;
  grid-template-columns: 1fr min(40rem, 400px);
  align-items: start;
  gap: min(4rem, 40px);
}

main.brandManager div.brandManager_wrap div.brandManager_list_box {
  padding: 0 min(1.5rem, 15px) min(1.5rem, 15px) 0;
  position: relative;
}

main.brandManager div.brandManager_wrap div.brandManager_list_box::before {
  content: "";
  display: block;
  position: absolute;
  width: min(0.1rem, 1px);
  height: 95%;
  background-color: var(--color-brand_purple);
  right: 0;
  bottom: 0;
}

main.brandManager div.brandManager_wrap div.brandManager_list_box::after {
  content: "";
  display: block;
  position: absolute;
  width: 95%;
  height: min(0.1rem, 1px);
  background-color: var(--color-brand_purple);
  right: 0;
  bottom: 0;
}

main.brandManager div.brandManager_wrap div.brandManager_list_wrap {
  border: min(0.1rem, 1px) solid var(--color-brand_purple);
  padding: min(3rem, 30px) min(2rem, 20px);
}

main.brandManager div.brandManager_wrap div.brandManager_list_wrap h3.brandManager_list_ttl {
  font-size: min(1.6rem, 16px);
  font-weight: 700;
}

main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list {
  margin-top: min(2rem, 20px);
  display: flex;
  flex-direction: column;
  gap: min(1rem, 10px);
}

main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list li.brandManager_item {
  font-size: min(1.6rem, 16px);
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: min(1rem, 10px);
}

main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list li.brandManager_item::before {
  content: "";
  background-image: url(../images/about/brandManager/icon_checkMark.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: min(2.0rem, 20px);
  height: min(2.0rem, 20px);
  flex-shrink: 0;
}

main.brandManager section.brandManager_difference {
  background-color: #F5F5F5;
}

main.brandManager section.brandManager_difference p.brandManager_note {
  margin-top: min(4rem, 40px);
  padding-top: min(1rem, 10px);
  border-top: min(0.1rem, 1px) solid #B9B9B9;
  font-size: min(1.4rem, 14px);
  font-weight: 400;
  padding-left: 1em;
  text-indent: -1em;
  line-height: 1.2;
}

main.brandManager section.brandManager_benefit div.video_wrap {
  margin: min(4rem, 40px) auto 0;
  width: 75%;
  height: min(45rem, 450px);
}

main.brandManager section.brandManager_benefit div.video_wrap iframe {
  width: 100%;
}

main.brandManager section.brandManager_benefit div.link_area {
  margin: min(8rem, 80px) auto 0;
  width: fit-content;
  display: flex;
  align-items: center;
  gap: min(4rem, 40px);
}

@media (max-width: 799px) {
  main.brandManager section.inner_mv {
    background-image: url(../images/about/brandManager/bg_mv_brandManager.jpg);
    background-size: cover;
  }
  
  main.brandManager div.brandManager_wrap {
    margin-top: 4rem;
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 4rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_box {
    margin: 0 auto;
    width: 100%;
    padding: 0 1.5rem 1.5rem 0;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_box::before {
    width: 0.1rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_box::after {
    height: 0.1rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_wrap {
    border: .1rem solid var(--color-brand_purple);
    padding: 3rem 2rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_wrap h3.brandManager_list_ttl {
    font-size: 1.4rem;
    line-height: 1.4;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list {
    margin-top: 2rem;
    gap: 1rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list li.brandManager_item {
    font-size: 1.4rem;
    gap: 1rem;
  }
  
  main.brandManager div.brandManager_wrap div.brandManager_list_wrap ul.brandManager_list li.brandManager_item::before {
    width: 1.6rem;
    height: 1.6rem;
  }
  
  main.brandManager section.brandManager_difference p.brandManager_note {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: .1rem solid #B9B9B9;
    font-size: 1.2rem;
    line-height: 1.6;
  }
  
  main.brandManager section.brandManager_benefit div.video_wrap {
    margin: 4rem auto 0;
    width: 95%;
    height: 30rem;
  }
  
  main.brandManager section.brandManager_benefit div.link_area {
    margin: 4rem auto 0;
    width: 100%;
    flex-direction: column;
    gap: 1rem;
  }
}

/* ----- strategy.html ----- */

main.strategy section.inner_mv {
  background-image: url(../images/about/strategy/bg_mv_strategy.jpg);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.strategy section.strategy_lead div.strategy_image {
  margin: min(4rem, 40px) auto 0;
  width: 75%;
}

main.strategy section.strategy_lead div.strategy_wrap {
  margin: min(4rem, 40px) auto 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: min(2rem, 20px);
}

main.strategy section.strategy_lead div.strategy_wrap div.strategy_item h3.strategy_item_ttl {
  padding: min(0.5rem, 5px) min(1rem, 10px);
  border-left: min(0.5rem, 5px) solid var(--color-brand_purple);
  font-size: min(1.8rem, 18px);
  font-weight: 700;
}

main.strategy section.strategy_lead div.strategy_wrap div.strategy_item p.common_txt {
  margin-top: min(1rem, 10px);
}

main.strategy section.strategy_important {
  background-image: url(../images/about/strategy/bg_strategy01.png);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.strategy section.strategy_branding {
  background-image: url(../images/about/strategy/bg_strategy02.png);
  background-size: min(400rem, 4000px);
  background-position: center top;
  background-repeat: no-repeat;
}

main.strategy section.strategy_branding div.container {
  padding-left: min(40rem, 400px);
}

main.strategy section.strategy_branding div.branding_term_wrap {
  margin-top: min(2rem, 20px);
  padding: min(2rem, 20px);
  border: min(0.1rem, 1px) solid #707070;
  display: flex;
  flex-direction: column;
  gap: min(2rem, 20px);
}

main.strategy section.strategy_branding div.branding_term_wrap p.branding_term_item {
  font-size: min(1.6rem, 16px);
  font-weight: 700;
}

main.strategy section.strategy_branding div.branding_term_wrap p.branding_term_item span {
  display: block;
  margin-top: min(1rem, 10px);
  font-weight: 400;
}

main.strategy section.strategy_branding p.common_txt:last-of-type {
  margin-top: min(2rem, 20px);
}

main.strategy section.strategy_influence {
  background-image: url(../images/about/strategy/bg_strategy03.png);
  background-size: min(400rem, 4000px);
  background-position: center bottom;
  background-repeat: no-repeat;
}

@media (max-width: 799px) {
  main.strategy section.inner_mv {
    background-image: url(../images/about/strategy/bg_mv_strategy.jpg);
    background-size: cover;
  }
  
  main.strategy section.strategy_lead div.strategy_image {
    margin: 4rem auto 0;
    width: 95%;
  }
  
  main.strategy section.strategy_lead div.strategy_wrap {
    margin: 4rem auto 0;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
  }
  
  main.strategy section.strategy_lead div.strategy_wrap div.strategy_item h3.strategy_item_ttl {
    padding: .5rem 1rem;
    border-left: .5rem solid var(--color-brand_purple);
    font-size: 1.6rem;
    line-height: 1.2;
  }
  
  main.strategy section.strategy_lead div.strategy_wrap div.strategy_item p.common_txt {
    margin-top: 1rem;
  }
  
  main.strategy section.strategy_important {
    background-image: url(../images/about/strategy/bg_strategy01.png);
    background-size: 250rem;
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.strategy section.strategy_branding {
    background-image: url(../images/about/strategy/bg_strategy02.png);
    background-size: 250rem;
    background-position: center top;
    background-repeat: no-repeat;
  }
  
  main.strategy section.strategy_branding div.container {
    padding-left: 2rem;
  }
  
  main.strategy section.strategy_branding div.branding_term_wrap {
    margin-top: 2rem;
    padding: 2rem 1rem;
    border: .1rem solid #707070;
    gap: 3rem;
  }
  
  main.strategy section.strategy_branding div.branding_term_wrap p.branding_term_item {
    font-size: 1.4rem;
  }
  
  main.strategy section.strategy_branding div.branding_term_wrap p.branding_term_item span {
    margin-top: 1rem;
  }
  
  main.strategy section.strategy_branding p.common_txt:last-of-type {
    margin-top: 2rem;
  }
  
  main.strategy section.strategy_influence {
    background-image: url(../images/about/strategy/bg_strategy03.png);
    background-size: 250rem;
    background-position: center top;
  }
}