@charset "utf-8";

/*
-----------------------------------------------------
◆◆あんしん少額短期保険　スタイルシート◆◆
◇◇◇◇企業理念ページ定義◇◇◇◇
-----------------------------------------------------
-----------------------------------------------------
【改訂履歴】
26/02/26：初版作成
-----------------------------------------------------
*/

:root {
    --white: #ffffff;
    --blue: #003a79;
    --red: #D82115;
    --green: #009933;
    --glay: #bbb;
}

@media screen and (min-width: 768px) {
	.NoPC {
		display: none;
	}
	.NoSP {
		display: block;
	}
}

@media screen and (max-width: 767px) {
	.NoPC {
		display: block;
	}
	.NoSP {
		display: none;
	}
}

.IdeaContent {
	padding: 1rem;
	background-color: var(--blue);
	color: var(--white);
	font-family: "BIZ UDPGothic", sans-serif;
	font-weight: 400;
	font-style: normal;
	
	h2 {
		padding: 0 0 0 0;
		background: none;
		text-align: center;
		border-radius: 0;
	}
	h3 {
		margin-block-end: .5rem;
		padding: 0 0 0 0;
		background: none;
		border-left: none;
		border-bottom: none;
		font-weight: 700;
	}
	@media (width < 768px) {
    	h2 {
			margin-block-start: 2rem;
		}
  	}
	li::before {
		display: none;
	}
	@media (width < 768px) {
    	p {
			line-height: 1.8;
		}
  	}
	.serif {
		font-family: "Zen Old Mincho", serif;
  		font-weight: 700;
  		font-style: normal;
	}
	.center {
			text-align: center;
	}
	@media (width >= 768px) {
		.pc-center {
			text-align: center;
		}
	}
	.text-xx-large {
		font-size: 2.5rem;
	}
	@media (width < 768px) {
    	.text-xx-large {
			font-size: 1.5rem;
		}
  	}
	.text-x-large {
		font-size: 2rem;
	}
	.text-large {
		font-size: 1.2rem;
	}
	@media (width < 768px) {
    	.text-large {
			font-size: 1.1rem;
		}
  	}
	.text-small {
		font-size: .8rem;
	}
	.text-bold {
		font-weight: 700;
	}
	.text-red {
		color: var(--red);
	}
	.text-blue {
		color: var(--blue);
	}
	.text-green {
		color: var(--green);
	}
	.text-white {
		color: var(--white);
	}
	.heading-policy {
		letter-spacing: 1rem;
	}
	.heading-border {
		display: flex;
		align-items: center;
		letter-spacing: .5rem;
	}
	.heading-border::before,
	.heading-border::after {
		flex-grow: 1;
		content: "";
		height: 1px;
		background-color: var(--white);
		border-radius: 5px;
	}
	.heading-border::before {
	margin-right: 1rem; 
	}
	.heading-border::after {
	margin-left: .5rem; 
	}
	.heading-box {
		display: inline-block;
		padding: .5rem .5rem .5rem 1rem;
		border: 1px solid var(--white);
		letter-spacing: .5rem;
	}
	.glay-box {
		padding: .25rem;
		background-color: var(--glay);
	}
	p:has(+ .annotation) {
		margin-block-end: 0.25rem;
	}
	.idea {
		padding: 1rem;
	}
	.idea li {
		padding-left: 1.5rem;
	}
	.idea li::before {
		display: block;
		padding-right: 1rem;
		content: "○";
		color: var(--white);
	}
	.conduct p,
	.guidelines p {
		margin-inline-start: 3rem;
	}
	@media (width < 768px) {
    	.conduct p,
		.guidelines p {
			margin-inline-start: 1rem;
		}
  	}
}