body {
        font-family:  "BIZ UDPMincho","Gowun Batang", monospace;
        background-color: #f9f9f9;
        color: #333;
        margin: 0;
        padding: 0;
      }

#office {
    max-width: 960px; /* コンテンツの最大幅 */
    margin: 0 auto; /* 中央寄せ */
    padding: 20px; /* 内側の余白 */
}

#title {
	font-family: "Gowun Batang","BIZ UDPMincho", monospace;
    padding-left: 60px;
    line-height: 200%;
}

.office_title {
    font-size: large;
    text-align: left;
    font-weight: bold;
    color: #333333;
}


		
		 .contact-item {
            margin-bottom: 20px;
			
        }

        .label {

            text-align: right;
            margin-right: 10px;
			
        }

        .value {
			float: right;
        }

        .value a {
            text-decoration: none;
            color: Dimgray;
        }

        .map {
            margin-top: 10px;
        }

        .map iframe {
            width: 100%;
            height: 250px;
            border: 0;
        }

        .map small {
            display: block;
            margin-top: 5px;
            text-align: left;
        }

        .map small a {
            color: #0000FF;
        }








/*特定の範囲センター揃え*/


/* コンテンツのレイアウト調整 */
.contact-info {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-bottom: 20px;
}

.contact-info > div {
    flex: 1 1 45%;
    margin: 10px;
}


		.profile {
    max-width: 600px;
    margin: 0 auto;
    font-size: 14px;
}

.profile-item {
	
    display: flex;
    align-items: center; /* 上下中央に配置 */
	margin-bottom: 10px;
}



       

        .year {
			flex: 0 0 auto; /* サイズを固定 */
    		margin-right: 15px; /* 適宜調整 */
            font-size: 14px;
           
		}

        .description {
			flex: 1 1 auto; /* 自動伸縮 */
			
        }
		
		
		
		/* frame1 と frame2 のレイアウト調整 */
.frame1, .frame2 {
    background-color: #fff;
    padding: 20px;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    margin-bottom: 20px;
    text-align: left;
}

.frame3 {
    background-color: #fff;
    padding: 20px;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    margin-bottom: 20px;
    text-align: left;
}
		
@media (min-width: 601px) {

	
		  .frame1 {
		  width: 50%;
    float: left;
        display: flex;
    }
	
	  .frame2 {
		  width: calc(50% - 100px);
    float: right;
        display: flex;
    }

}

		
@media (max-width: 600px) {
	
   .frame1, .frame2 {
        display: block;
    }
	
	
	
}