@charset "utf-8";
@import url("root.css");

/*------------------------------------------------------------
 企画例
------------------------------------------------------------*/
main {
	/* *{outline:1px solid #0000FF} */

	&.faq_page {

		section {

			&.tab_box {
				background: var(--bg);

				ul {
					width: 100%;

					li {
						a {
							color: #333;
							padding: 13px 18px;
							font-weight: 600;
							display: block;
							overflow: hidden;
							border-radius: 5px;
							background: white;
							box-shadow: 0 2px 0 #bfbfbf;
							border: 1px solid #bfbfbf;
							transform: translateY(0px);
							text-decoration: none;
							transition: all .1s;
							margin: 0 3px 3px;
							font-size: 1.6rem;

							i {
								margin-left: 10px;
							}

							&:hover {
								border-color: var(--blue-green);
								background: var(--blue-green);
								color: white;
								transform: translateY(2px);
								box-shadow: none;
								opacity: 1;
							}
						}
					}
				}
			}

			&.faq {
				padding-top: 0;
				padding-bottom: 0;
				padding-bottom: 55px;

				background: var(--bg);

				.faq_box {
					padding: 0;

					.faq_toggle {
						background: white;
						border-radius: 6px;
						overflow: hidden;
						margin-bottom: 20px;

						h3 {
							background: var(--blue-green);
							padding: 20px 45px;
							font-size: 2.4rem;
							color: white;
							letter-spacing: 0.06em;
							cursor: pointer;
							transition: all .1s;
							position: relative;

							&:hover {
								opacity: 0.8;
							}

							&::after {
								position: absolute;
								font-family: "Font Awesome 6 Free";
								font-weight: 700;
								content: "\2b";
								right: 35px;
							}


							&.on {
								&::after {
									content: "\f068";
								}

							}
						}

						.faq_content {
							padding: 35px 45px 50px;

							dl {

								dt,
								dd {
									padding-left: 40px;
								}

								dt {
									font-size: 1.8rem;
									font-weight: 600;
									margin-bottom: 25px;
									line-height: 3.2rem;
									position: relative;

									&::before {
										position: absolute;
										color: var(--blue-green);
										content: "Q.";
										font-weight: 700;
										font-size: 2.4rem;
										letter-spacing: 0.1em;
										font-family: var(--montserrat);
										left: 0;
									}
								}

								dd {
									font-size: 1.6rem;
									margin-bottom: 45px;
									padding-bottom: 45px;
									line-height: 3.1rem;
									border-bottom: 1px solid #dedede;

									&:last-child {
										padding-bottom: 0;
										border: 0;
										margin-bottom: 0;
									}
								}
							}

						}
					}

				}

			}


		}

	}
}