/* ==================================================
   Common
================================================== */



/* ==================================================
   visual
================================================== */
#home{
	& #visual{
		padding: 240px 120px;
		background:#0d295d url(../img/bk_ripple_top.svg) no-repeat right center  / auto calc(140%*0.9);
	}
}
@media screen and (max-width:960px){
	#home{
		& #visual{
			margin-top:80px;
		}
	}
}
@media screen and (max-width:910px){
	#home{
		& #visual{
			width:100vw;
			padding: 240px 5vw;
		}
	}
}
@media screen and (max-width:420px) {
	#visual{
		margin-left: 0;
		margin-right: 0;
	}
}


/* ==================================================
   topics
================================================== */
#home{
	& #topics_list{
		margin-bottom:45px;
		& h1.ttl_main{
			margin-bottom:30px;
		}
		& dl.topics_list{
			width: 100%;
			max-width: 780px;
		}
	}
}
@media screen and (max-width:540px){
	#home{
		& div#contents #topics_list dl.topics_list{
			margin-bottom:45px;
		}
	}
}


/* ==================================================
   award_program
================================================== */
@media screen and (max-width:960px){
	#home{
		& #award_program{
			& h1.ttl_main{
				margin-bottom:60px;
			}
		}
	}
}
@media screen and (max-width:540px){
	#home{
		& #award_program{
			& h1.ttl_main{
				margin-bottom:30px;
				font-size: 42px;
			}
		}
	}
}
@media screen and (max-width:420px){
	#home{
		& #award_program{
			& h1.ttl_main{
				font-size: 32px;
			}
		}
	}
}
/* ==================================================
   about_blue_prize
================================================== */
#home{
	& #about_blue_prize{
		& h2.sttl{
			margin-bottom:60px;
			text-align:center;
		}
		& p{
			max-width:780px;
			margin:0 auto;
			
		}
	}
}

/* ==================================================
   blue_message
================================================== */
#home{
	& #blue_message{
		& p.outline{
			max-width:768px;
			min-height:225px;
			margin-top:30px;
			padding:30px 0 0 calc(225px + 30px) ;
			background:url(../img/earth.svg) no-repeat left top / 225px auto;
		}
		& p.naming{
			padding:30px 0;
			color:#0d295d;
			font-size:28px;
			text-align:center;
			letter-spacing:0.05em;
			border-top:2px #dcdcdc solid;
			border-bottom:2px #dcdcdc solid;
		}
	}
}
@media screen and (max-width:960px){
	#home{
		& #blue_message{
			& p.naming{
				font-size:24px;
			}
		}
	}
}
@media screen and (max-width:640px){
	#home{
		& #blue_message{
			& p.outline{
				width:100%;
				margin-top:0;
				padding:calc(225px + 15px) 0 0 ;
				background:url(../img/earth.svg) no-repeat center top / 225px auto;
			}
			& p.naming{
				font-size:20px;
			}
			& p.naming br{
				display:none;;
			}
		}
	}
}
@media screen and (max-width:540px){
	#home{
		& #blue_message{
			& p.naming{
				font-size:20px;
			}
		}
	}
}

/* ==================================================
   why_dentistry
================================================== */
#home{
	& #why_dentistry{
		& h1.sttl{
			margin-bottom:60px;
		}
		& h2.sttl{
			margin-bottom:15px;
		}
		& p.outline{
			max-width:780px;
		}
		& ul.no{
	   		max-width: 24em;
    		margin: 0 auto;
    	}
		& ul li{
			position:relative;
			margin:0 0 30px 90px;
			padding:0 0 0 30px;
			border-left:2px #dcdcdc solid;
			&:before{
				position:absolute;
				top:-0.2em;
				margin-left:-120px;
				font-size:36px;
			}
			& h2.sttl{
				text-align:left;
			}
		}
	}
}
@media screen and (max-width:540px){
	#home {
		& #why_dentistry {
			& ul li {
				margin: 0 0 30px 70px;
				padding: 0 0 0 20px;
				&::before {
					margin-left: -90px;
				}
			}
		}
	}
}

/* ==================================================
   target_field
================================================== */
#home{
	& #target_field{
		& h1.sttl{
			margin-bottom:30px;
		}
		& p.outline{
			text-align:center;
		}
		& ul{
			letter-spacing:-0.4em;
			& li{
				width:calc(50% - 45px);
				display:inline-block;
				margin:0 90px 60px 0;
				vertical-align:top;
				letter-spacing:normal;
				zoom:1;
				&:nth-child(2n){
					margin-right:0;
				}
				& h2.sttl{
					text-align:left;
				}
				& p{
					color:#0d295d;
				}
			}
		}
		& p.point{
			padding:30px 0;
			font-size:24px;
			text-align:center;
			border-top:2px #dcdcdc solid;
			border-bottom:2px #dcdcdc solid;
		}
	}
}
@media screen and (max-width:1054px){
	#home {
	  & #target_field {
	    & ul {
	      & li {
	        width: calc(50% - 30px);
	        margin-right:60px;
	        & h2.sttl{
	        	font-size: 22px;
	        }
	      }
	    }
	  }
	}
}
@media screen and (max-width:820px){
	#home {
	  & #target_field {
	    & ul {
	      & li {
	        width: calc(50% - 30px);
	        margin-right:60px;
	        & h2.sttl{
	        	font-size: 22px;
	        }
	      }
	    }
	  }
	}
}
@media screen and (max-width:760px){
	#home {
	  & #target_field {
	    & ul {
	      & li {
	        width: calc(50% - 15px);
	        margin-right:30px;
	      }
	    }
	  }
	}
}
@media screen and (max-width:540px){
	#home {
		& #target_field {
			& ul {
				& li {
					width:100%;
					margin-right:0;
					margin-bottom:15px
				}
			}
			& p.outline{
				text-align:left;
				& br{
	    			display:none;
	    		}
	    	}
			& p.point{
				font-size:20px;
			}
			& p.point br{
				display:none;
			}
		}
	}
}

/* ==================================================
   selection_policy
================================================== */
#home{
	& #selection_policy{
		& h1.sttl{
			margin-bottom:30px;
		}
		& p.outline{
			max-width:780px;
			text-align:center;
			& + p{
				margin-bottom:60px;
				text-align:center;
			}
		}
		& ul{
			letter-spacing:-0.4em;
			& li{
				width:calc(50% - 45px);
				display:inline-block;
				margin:0 90px 60px 0;
				vertical-align:top;
				letter-spacing:normal;
				zoom:1;
				&:nth-child(2n){
					margin-right:0;
				}
				& h2.sttl{
					text-align:left;
				}
				& p{
					color:#0d295d;
				}
			}
		}
	}
}
@media screen and (max-width:820px){
	#home {
	  & #selection_policy {
	    & ul {
	      & li {
	        width: calc(50% - 30px);
	        margin-right:60px;
	        & h2.sttl{
	        	font-size: 22px;
	        }
	      }
	    }
	  }
	}
}
@media screen and (max-width:760px){
	#home {
	  & #selection_policy {
	    & ul {
	      & li {
	        width: calc(50% - 15px);
	        margin-right:30px;
	      }
	    }
	  }
	}
}
@media screen and (max-width:540px){
	#home {
		& #selection_policy {
			& ul {
				& li {
					width:100%;
					margin-right:0;
					margin-bottom:15px
				}
			}
			& p.outline{
				text-align:left;
				& br{
	    			display:none;
	    		}
	    	}
		}
	}
}

		

/* ==================================================
   prize_structure
================================================== */
#home{
	& #prize_structure{
		& h1.sttl{
			margin-bottom:30px;
		}
		& p.recognition + ul + p{
			text-align:center;
		}
		& p.outline{
			text-align:center;
		}
		& p.recognition{
			margin-top:0;
			margin-bottom:30px;
			padding-top:220px;
			font-size:28px;
			text-align:center;
			mix-blend-mode: multiply;
			background:url(../img/prize_structure.png) no-repeat center top;
			& strong{
				font-size:48px;
			}
		}
		& ul{
			margin-bottom:30px;
			padding:30px 0;
			border-top:2px #dcdcdc solid;
			border-bottom:2px #dcdcdc solid;
			& li{
				width:calc(33.33% - 20px);
				margin:0 30px 0 0;
				&:nth-child(3n){
					margin-right:0;
				}
				&:nth-child(1) h2.sttl{background-image:url(../img/prize_structure1.png);}
				&:nth-child(2) h2.sttl{background-image:url(../img/prize_structure2.png);}
				&:nth-child(3) h2.sttl{background-image:url(../img/prize_structure3.png);}
				& h2.sttl{
					margin-bottom:30px;
					padding-bottom:210px;
					mix-blend-mode: multiply;
					letter-spacing:0.5em;
					background-repeat:no-repeat;
					background-position:center bottom;
					background-size: auto 80%;
					& + p{
						color:#0d295d;
						font-size:24px;
						text-align:center;
						& strong{
							font-size:42px;
							line-height: 0.5;
						}
					}
				}
			}
		}
	}
}
@media screen and (max-width:760px){
	#home {
		& #prize_structure {
			& p.recognition {
				font-size: 22px;
			}
	    & ul {
	      & li {
	        & h2.sttl {
	          padding-bottom: 26vw;
	          & + p {
            	font-size: 22px;
            	 & strong {
             	 font-size: 36px;
              }
         	 }
	        }
	      }
	    }
	  }
	}
}
@media screen and (max-width:540px){
	#home {
	  & #prize_structure {
	    & ul {
	      & li {
	      	width: calc(33.33% - 10px);
        	margin: 0 15px 0 0;
	        & h2.sttl {
	        	margin-bottom:10px;
	          text-align:center;
	          & + p {
            	font-size: 20px;
            	 & strong {
             	 font-size: 30px;
              }
         	 }
	        }
	      }
	    }
	  }
	}
}
@media screen and (max-width:420px){
	#home {
	  & #prize_structure {
	    & ul {
	      & li {
	        & h2.sttl {
	          & + p {
            	font-size: 16px;
            	 & strong {
             	 font-size: 24px;
              }
         	 }
	        }
	      }
	    }
	  }
	}
}
/* ==================================================
   selection_committee
================================================== */
#home{
	& #selection_committee{
		& h1.sttl{
			margin-bottom:30px;
		}
		& p.outline{
			max-width:780px;
			text-align:center;
		}
		& ul li{
			position:relative;
			margin:0 0 60px 200px;
			padding:0 0 0 60px;
			border-left:2px #dcdcdc solid;
			&:before{
				position:absolute;
				top:50%;
				margin-top: -0.5em;
				margin-left:-260px;
				line-height: 1;:
			}
			& h2.sttl{
				text-align:left;
			}
			& p{
				margin:0;
				&.indent{
					padding-left:4em;
					text-indent:-4em;
				}
			}
		}
		& p.promise{
			padding:30px 0;
			font-size:24px;
			text-align:center;
			border-top:2px #dcdcdc solid;
			border-bottom:2px #dcdcdc solid;
		}
	}
}
@media screen and (max-width:960px){
	#home {
		& #selection_committee {
			& ul li {
				margin: 0 0 60px 130px;
				padding-left:40px;
				&::before {
					margin-left: -190px;
				}
			}
		}
	}
}
@media screen and (max-width:820px){
	#home {
		& #selection_committee {
			& ul.no li {
				& h2.sttl{
					font-size:22px;
				}
			}
		}
	}
}
@media screen and (max-width:680px){
	#home {
		& #selection_committee {
			& ul.no li {
				margin: 0 0 30px;
				padding-left:0;
				border-left: none;
				&::before {
					position:static;
					margin: 0;
					line-height: 1.4;
				}
				& h2.sttl{
					font-size:22px;
				}
			}
			& p.promise{
				font-size:20px;
			}
			& p.promise br{
				display:none;
			}
		}
	}
}